<template>
  <div class="yield-rate-container">
    <!-- 搜索区域 -->
    <div class="search-panel">
      <div class="search-row">
        <div class="search-item time-selection">
          <span class="label">日期</span>
          <el-date-picker
            v-model="searchParams.dateRange"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            class="custom-date-picker"
            size="small"
            style="margin-left: 10px; width: 240px"
          />
        </div>
        <div class="search-item">
          <span class="label">入口卷号</span>
          <el-input v-model="searchParams.annealingEntryRollNo" placeholder="请输入" class="custom-input" size="small" />
        </div>
        <div class="search-item">
          <span class="label">出口卷号</span>
          <el-input v-model="searchParams.annealingExitRollNo" placeholder="请输入" class="custom-input" size="small" />
        </div>
        <div class="search-item">
          <span class="label">机组</span>
          <el-input v-model="searchParams.rewindingUnit" placeholder="请输入" class="custom-input" size="small" />
        </div>
        <div class="search-item">
          <span class="label">异常筛选</span>
          <el-select v-model="searchParams.porCutFlag" placeholder="请选择" size="small" class="custom-select" style="width: auto; min-width: 160px">
            <el-option label="正常" value="0" />
            <el-option label="异常" value="1" />
          </el-select>
        </div>
        <div class="search-actions">
          <button class="btn query-btn" @click="handleSearch">查询</button>
          <button class="btn reset-btn" @click="handleReset">重置</button>
          <button class="btn export-btn" @click="handleExport">导出</button>
          <el-tooltip effect="dark" :content="`选择需要编辑的行<br>修改异常原因`" placement="top-start" raw-content>
            <el-button :disabled="selection.length == 0" @click="reasonEdit">编辑</el-button>
          </el-tooltip>
        </div>
      </div>
    </div>

    <!-- 表格标签切换区域 -->
    <div class="table-tabs-bar">
      <el-tabs v-model="activeTab" class="table-tabs" @tab-change="handleTabChange">
        <el-tab-pane label="镀锌1870" name="cgl1870"></el-tab-pane>
        <el-tab-pane label="连退1630" name="cal1630"></el-tab-pane>
        <el-tab-pane label="连退2150" name="cal2150"></el-tab-pane>
        <el-tab-pane label="酸轧2280" name="tcm2280"></el-tab-pane>
        <el-tab-pane label="重卷1870" name="rew1870"></el-tab-pane>
        <el-tab-pane label="重卷1630" name="rew1630"></el-tab-pane>
        <el-tab-pane label="重卷2150" name="rew2150"></el-tab-pane>
      </el-tabs>
    </div>

    <!-- 表格区域 -->
    <div class="table-panel">
      <el-table
        v-if="activeTab === 'cgl1870'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :row-style="{ background: '#0f2142' }"
        :scrollbar-always-on="true"
        :show-overflow-tooltip="true"
        @selection-change="handleSelectionChange"
        ref="cgl1870TableRef"
        :row-class-name="rowClassName"
        v-loading="tableLoading"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />
        <!-- <el-table-column type="index" label="序号" width="40" align="center" :index="indexMethod" fixed="left" /> -->
        <el-table-column label="钢卷号">
          <el-table-column prop="coldCoilId" label="入口" width="140" />
          <el-table-column prop="cglCoilId" label="出口" width="140" />
        </el-table-column>
        <!-- <el-table-column prop="sumcoilNum" label="子卷数" width="90"/> -->
        <el-table-column label="总成材率">
          <el-table-column prop="totalYield" label="不含锌层[%]" width="100">
            <template #default="{ row }"> {{ (row.totalYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalZnYield" label="含锌层[%]" width="90">
            <template #default="{ row }"> {{ (row.totalZnYield * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="理论成材率">
          <el-table-column prop="noznYieldTheory" label="不含锌层[%]" width="100">
            <template #default="{ row }"> {{ (row.noznYieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="znYieldTheory" label="含锌层[%]" width="90">
            <template #default="{ row }"> {{ (row.znYieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口切头">
          <el-table-column prop="porCutHeadLenTheory" label="理论长度[m]" width="100" />
          <el-table-column prop="enCutheadLen" label="实际长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="理论重量[kg]" width="120" />
          <el-table-column prop="enCutheadWt" label="实际重量[kg]" width="120" />
        </el-table-column>
        <el-table-column label="入口切尾">
          <el-table-column prop="porCutTailLenTheory" label="理论长度[m]" width="100" />
          <el-table-column prop="enCuttailLen" label="实际长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="理论重量[kg]" width="120" />
          <el-table-column prop="enCuttailWt" label="实际重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口切头">
          <el-table-column prop="trCutHeadLenTheory" label="理论长度[m]" width="100" />
          <el-table-column prop="exCutheadLen" label="实际长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="理论重量[kg]" width="120" />
          <el-table-column prop="exCutheadWt" label="实际重量[kg]" width="120" />
        </el-table-column>
        <el-table-column label="出口切尾">
          <el-table-column prop="trCutTailLenTheory" label="理论长度[m]" width="100" />
          <el-table-column prop="exCuttailLen" label="实际长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="理论重量[kg]" width="120" />
          <el-table-column prop="exCuttailWt" label="实际重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
          <el-table-column prop="trimWt" label="实际重量[kg]" width="120" />
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="trimWtTheory" label="长度[m]" width="90" />
          <el-table-column prop="trimWt" label="厚度[mm]" width="90" />
          <el-table-column prop="trimWidth" label="宽度[mm]" width="90" />
          <el-table-column prop="trimWidth" label="重量[kg]" width="90" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="90" />
          <el-table-column prop="exThk" label="厚度[mm]" width="90" />
          <el-table-column prop="exWid" label="宽度[mm]" width="90" />
          <el-table-column prop="exWt" label="重量[kg]" width="90" />
        </el-table-column>

        <el-table-column label="出口取样">
          <el-table-column prop="exSampleLen" label="长度[m]" width="90" />
          <el-table-column prop="exSampleNum" label="刀数" width="90" />
          <el-table-column prop="exSampleWt" label="重量[kg]" width="90" />
        </el-table-column>

        <el-table-column label="全长锌层重量">
          <el-table-column prop="lenZnCoatWtPlan" label="理论[kg]" width="90" />
          <el-table-column prop="lenZnCoatWtAct" label="实际[kg]" width="90" />
        </el-table-column>

        <el-table-column prop="abnormalReason" label="成材率异常原因" width="240" />
       
        <el-table-column label="表面锌层">
          <el-table-column prop="zncoatthk" label="厚度[mm]" width="90" />
          <el-table-column prop="planzncoatwt" label="重量[kg]" width="90" />
        </el-table-column>
        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="140" />
          <el-table-column prop="prodEndTime" label="结束" width="140" />
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="200" />

        <el-table-column label="分档">
          <el-table-column prop="yp_class" label="钢种" width="90" />
          <el-table-column prop="exwidthClass" label="宽度[mm]" width="90" />
          <el-table-column prop="exthkClass" label="出口厚度[mm]" width="120" />
        </el-table-column>

        <el-table-column prop="planno" label="计划号" width="100" />
        <el-table-column prop="porNo" label="开卷机号" width="100" />
        <el-table-column prop="steelGrade" label="原料钢种" width="100" />
        <el-table-column prop="surfacemode" label="表面处理方式" width="120" />
        <el-table-column prop="cglNeck" label="镀锌缩颈量" width="100" />
        <el-table-column prop="hotCoilId" label="热轧卷号" width="100" />

        <el-table-column label="全流程成材率">
          <el-table-column prop="wholeTotalExwtSum" label="酸轧-连退-重卷出口卷重[kg]" width="200" />
          <el-table-column prop="tcmEnWt" label="酸轧入口重量[kg]" width="150" />
          <el-table-column prop="totalNoznWeight" label="子卷重量和(不含锌层)[kg]" width="180" />
          <el-table-column prop="totalSumWeight" label="子卷重量和(含锌层)[kg]" width="180" />
        </el-table-column>

        <el-table-column label="重卷">
          <el-table-column prop="rclCoil1" label="卷号1" width="100" />
          <el-table-column prop="rclCoil2" label="卷号2" width="100" />
          <el-table-column prop="rclCoil3" label="卷号3" width="100" />
          <el-table-column prop="rclExWt1" label="卷号1出口重量[kg]" width="150" />
          <el-table-column prop="rclExWt2" label="卷号2出口重量[kg]" width="150" />
          <el-table-column prop="rclExWt3" label="卷号3出口重量[kg]" width="150" />
          <el-table-column prop="rclTotalExWt" label="出口重量和[kg]" width="150" />
          <el-table-column prop="rclAbnormalRamark" label="异常卷说明" width="180" />
        </el-table-column>

        <el-table-column label="镀锌出口测宽仪宽度">
          <el-table-column prop="cglExGaugeWidthMin" label="最小值[mm]" width="110" />
          <el-table-column prop="cglExGaugeWidthMax" label="最大值[mm]" width="110" />
          <el-table-column prop="cglExGaugeWidthAvg" label="平均值[mm]" width="110" />
        </el-table-column>

        <el-table-column label="镀锌入口测宽仪宽度">
          <el-table-column prop="cglCpc3WidthMin" label="最小值[mm]" width="110" />
          <el-table-column prop="cglCpc3WidthMax" label="最大值[mm]" width="110" />
          <el-table-column prop="cglCpc3WidthAvg" label="平均值[mm]" width="110" />
        </el-table-column>

        <el-table-column label="标记">
          <el-table-column prop="trimFlag" label="切边" width="90" />
        <el-table-column prop="dummyCoilFlag" label="过渡卷" width="90" />
        </el-table-column>
        
        <el-table-column label="异常标记(1为异常)">
          <el-table-column prop="porCuttailFlag" label="入口切尾" width="110" />
          <el-table-column prop="porCutheadFlag" label="入口切头" width="110" />
          <el-table-column prop="trCuttailFlag" label="出口切尾" width="110" />
          <el-table-column prop="trCutheadFlag" label="出口切头" width="110" />
          <el-table-column prop="trimWtFlag" label="切边" width="80" />
        </el-table-column>

        <!-- --{ prop: 'yield', label: '子卷成材率', width: '100' },
    --{ prop: 'customname', label: '客户名称', width: '150' },
    --{ prop: 'custcode', label: '客户代码', width: '150' },
   -- { prop: 'nextUnit', label: '下道工序', width: '150' },
       --  -- { prop: 'rclCoil5', label: '重卷卷号5', width: '150' },
      -- { prop: 'rclCoil4', label: '重卷卷号4', width: '150' },
      -- { prop: 'rclExWt5', label: '重卷出口子卷重量5', width: '150' },
      -- { prop: 'rclExWt4', label: '重卷出口子卷重量4', width: '150' },
    { prop: 'tcmYield', label: '酸轧工序成材率', width: '150' },
    { prop: 'tcmReason', label: '酸轧成材率原因', width: '150' },
 { prop: 'sonLenZnWt', label: '子卷上下表面全长锌层重量', width: '180' },
    { prop: 'totalLenZnWt', label: '所有子卷上下表面全长锌层重量', width: '180' }, -->

        <!-- <el-table-column v-for="col in yieldTcmColumns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center">
        </el-table-column> -->
      </el-table>
      <el-table
        v-if="activeTab === 'cal1630'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :row-style="{ background: '#0f2142' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        ref="cal1630TableRef"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />
        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" /> -->
        <el-table-column label="钢卷号">
          <el-table-column prop="coldCoilId" label="入口" width="120" />
          <el-table-column prop="calCoilId" label="出口" width="120" />
        </el-table-column>

        <el-table-column label="成材率">
          <el-table-column prop="yield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.yield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="porCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="porCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口实际">
          <el-table-column prop="exCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="exCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="exCutheadWt" label="切头重量[kg]" width="120" />
          <el-table-column prop="exCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="exCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="exCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口理论">
          <el-table-column prop="trCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="trCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
        </el-table-column>

        <el-table-column label="出口取样">
          <el-table-column prop="exSampleLen" label="长度[m]" width="100" />
          <el-table-column prop="exSampleNum" label="刀数" width="100" />
          <el-table-column prop="exSampleWt" label="重量[kg]" width="100" />
        </el-table-column>

          <el-table-column prop="abnormalReason" label="成材率异常原因" width="240" />
          <el-table-column prop="yieldRemark" label="异常原因描述" width="180" />

        <el-table-column label="入口测宽">
          <el-table-column prop="calWidthGuageCpc4Min" label="最小值[mm]" width="100" />
          <el-table-column prop="calWidthGuageCpc4Max" label="最大值[mm]" width="100" />
          <el-table-column prop="calWidthGuageCpc4Avg" label="平均值[mm]" width="100" />
        </el-table-column>

        <el-table-column label="出口测宽">
          <el-table-column prop="calExWidthGuageMin" label="最小值[mm]" width="100" />
          <el-table-column prop="calExWidthGuageMax" label="最大值[mm]" width="100" />
          <el-table-column prop="calExWidthGuageAvg" label="平均值[mm]" width="100" />
        </el-table-column>

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="calNeck" label="连退缩颈量" width="100" />
          <el-table-column prop="porNo" label="开卷机号" width="80" />
          <el-table-column prop="hotCoilId" label="热轧卷号" width="130" />
          <el-table-column prop="planno" label="计划号" width="100" />
          <el-table-column prop="ypClass" label="钢种分档" width="100" />
          <el-table-column prop="steelGrade" label="原料钢种" width="100" />
          <el-table-column prop="surfacemode" label="表面处理方式" width="100" />

        <el-table-column label="全流程成才率">
          <el-table-column prop="wholeTotalExwtSum" label="酸轧-连退-重卷出口重量[kg]" width="200" />
          <el-table-column prop="rclWholeYield" label="酸轧到重卷全工序成材率[%]" width="180" >
            <template #default="{ row }"> {{ (row.rclWholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="wholeYield" label="酸轧到连退全工序成材率[%]" width="200" >
            <template #default="{ row }"> {{ (row.wholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="tcmEnWt" label="酸轧入口重量[kg]" width="180" />
          <el-table-column prop="tcmReason" label="酸轧成材率原因" width="180" />
          <el-table-column prop="tcmYield" label="酸轧工序成材率[%]" width="140" >
            <template #default="{ row }"> {{ (row.tcmYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalSumWeight" label="所有子卷重量和[kg]" width="150" />
          <el-table-column prop="sumcoilNum" label="所有子卷个数" width="120" />
        </el-table-column>

        <el-table-column label="重卷">
          <el-table-column prop="rclCoil1" label="卷号1" width="160" />
          <el-table-column prop="rclCoil2" label="卷号2" width="160" />
          <el-table-column prop="rclCoil3" label="卷号3" width="160" />
          <el-table-column prop="rclExWt1" label="卷号1出口重量[kg]" width="160" />
          <el-table-column prop="rclExWt2" label="卷号2出口重量[kg]" width="160" />
          <el-table-column prop="rclExWt3" label="卷号3出口重量[kg]" width="160" />
          <el-table-column prop="rclTotalExWt" label="出口子卷重量和[kg]" width="160" />
          <el-table-column prop="rclAbnormalRamark" label="异常卷说明" width="160" />
        </el-table-column>

        <el-table-column prop="trimFlag" label="切边标记" width="120" />
          <el-table-column prop="custcode" label="客户代码" width="120" />
          <el-table-column prop="customname" label="客户名称" width="120" />
          <el-table-column prop="nextUnit" label="下道工序" width="120" />

        <!-- <el-table-column v-for="col in yieldCal1630Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center">
        </el-table-column> -->
      </el-table>
      <el-table
        v-if="activeTab === 'cal2150'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :row-style="{ background: '#0f2142' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        ref="cal2150TableRef"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />
        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" /> -->
        <el-table-column label="钢卷号">
          <el-table-column prop="coldCoilId" label="入口" width="120" />
          <el-table-column prop="calCoilId" label="出口" width="120" />
        </el-table-column>

        <el-table-column label="成材率">
          <el-table-column prop="yield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.yield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="porCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="porCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口实际">
          <el-table-column prop="exCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="exCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="exCutheadWt" label="切头重量[kg]" width="120" />
          <el-table-column prop="exCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="exCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="exCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口理论">
          <el-table-column prop="trCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="trCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
        </el-table-column>

        <el-table-column label="出口取样">
          <el-table-column prop="exSampleLen" label="长度[m]" width="100" />
          <el-table-column prop="exSampleNum" label="刀数" width="100" />
          <el-table-column prop="exSampleWt" label="重量[kg]" width="100" />
        </el-table-column>

          <el-table-column prop="abnormalReason" label="成材率异常原因" width="240" />
          <el-table-column prop="yieldRemark" label="异常原因描述" width="180" />

        <el-table-column label="入口测宽">
          <el-table-column prop="calWidthGuageCpc4Min" label="最小值[mm]" width="100" />
          <el-table-column prop="calWidthGuageCpc4Max" label="最大值[mm]" width="100" />
          <el-table-column prop="calWidthGuageCpc4Avg" label="平均值[mm]" width="100" />
        </el-table-column>

        <el-table-column label="出口测宽">
          <el-table-column prop="calExWidthGuageMin" label="最小值[mm]" width="100" />
          <el-table-column prop="calExWidthGuageMax" label="最大值[mm]" width="100" />
          <el-table-column prop="calExWidthGuageAvg" label="平均值[mm]" width="100" />
        </el-table-column>

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="calNeck" label="连退缩颈量" width="100" />
          <el-table-column prop="porNo" label="开卷机号" width="80" />
          <el-table-column prop="hotCoilId" label="热轧卷号" width="130" />
          <el-table-column prop="planno" label="计划号" width="100" />
          <el-table-column prop="ypClass" label="钢种分档" width="100" />
          <el-table-column prop="steelGrade" label="原料钢种" width="100" />
          <el-table-column prop="surfacemode" label="表面处理方式" width="100" />

        <el-table-column label="全流程成才率">
          <el-table-column prop="wholeTotalExwtSum" label="酸轧-连退-重卷出口重量[kg]" width="200" />
          <el-table-column prop="rclWholeYield" label="酸轧到重卷全工序成材率[%]" width="180" >
            <template #default="{ row }"> {{ (row.rclWholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="wholeYield" label="酸轧到连退全工序成材率[%]" width="200" >
            <template #default="{ row }"> {{ (row.wholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="tcmEnWt" label="酸轧入口重量[kg]" width="180" />
          <el-table-column prop="tcmReason" label="酸轧成材率原因" width="180" />
          <el-table-column prop="tcmYield" label="酸轧工序成材率[%]" width="140" >
            <template #default="{ row }"> {{ (row.tcmYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalSumWeight" label="所有子卷重量和[kg]" width="150" />
          <el-table-column prop="sumcoilNum" label="所有子卷个数" width="120" />
        </el-table-column>

        <el-table-column label="重卷">
          <el-table-column prop="rclCoil1" label="卷号1" width="160" />
          <el-table-column prop="rclCoil2" label="卷号2" width="160" />
          <el-table-column prop="rclCoil3" label="卷号3" width="160" />
          <el-table-column prop="rclExWt1" label="卷号1出口重量[kg]" width="160" />
          <el-table-column prop="rclExWt2" label="卷号2出口重量[kg]" width="160" />
          <el-table-column prop="rclExWt3" label="卷号3出口重量[kg]" width="160" />
          <el-table-column prop="rclTotalExWt" label="出口子卷重量和[kg]" width="160" />
          <el-table-column prop="rclAbnormalRamark" label="异常卷说明" width="160" />
        </el-table-column>

        <el-table-column prop="trimFlag" label="切边标记" width="120" />
          <el-table-column prop="custcode" label="客户代码" width="120" />
          <el-table-column prop="customname" label="客户名称" width="120" />
          <el-table-column prop="nextUnit" label="下道工序" width="120" />
        <!-- <el-table-column v-for="col in yieldCal2150Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center">
        </el-table-column> -->
      </el-table>
      <!--  -->
      <el-table
        v-if="activeTab === 'tcm2280'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        :row-style="{ background: '#0f2142' }"
        ref="tcm2280TableRef"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />
        <el-table-column label="钢卷号">
          <el-table-column prop="hotCoilId" label="入口" width="120" />
          <el-table-column prop="coldCoilId" label="出口" width="120" />
        </el-table-column>

        <el-table-column label="成材率">
          <el-table-column prop="yield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.yield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="enCutheadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="enCuttailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column prop="feoWtTheory" label="氧化铁皮重量[kg]" width="150" />

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
        </el-table-column>

          <el-table-column prop="abnormalReason" label="成材率异常原因" width="240" />
          <el-table-column prop="yieldRemark" label="异常原因描述" width="180" />

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="steelGrade" label="钢种牌号" width="100" />
        <el-table-column prop="ypClass" label="钢种分档" width="100" />
        <el-table-column prop="porNo" label="开卷机号" width="80" />
        <el-table-column prop="totalSumWeight" label="子卷总重量[kg]" width="150" />
        <el-table-column prop="subNum" label="分卷个数" width="120" />
        <el-table-column prop="planno" label="计划号" width="100" />
        <el-table-column prop="trimFlag" label="切边标记" width="100" />

        <el-table-column label="异常标记(1为异常)">
          <el-table-column prop="porCutheadFlag" label="入口切头" width="100" />
          <el-table-column prop="porCuttailFlag" label="入口切尾" width="100" />
          <el-table-column prop="trimWtFlag" label="切边" width="80" />
        </el-table-column>
        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" /> -->
        <!-- <el-table-column v-for="col in yieldTcm2280Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center"> -->
          <!-- <template #default="scope">
            <div v-if="col.prop == 'abnormalReason'">
              <el-input
                :value="scope.row[col.prop] || ''"
                @keyup.enter="handleReasonEnter(scope.row, scope.row[col.prop])"
                v-model="scope.row[col.prop]"
                @focus="handleReasonFocus(scope.row[col.prop])"
              >
                <template #append>
                  <div class="table-cell-btn">
                    <el-button type="primary" @click="handleReasonEnter(scope.row, scope.row[col.prop])" size="small">保存</el-button>
                  </div>
                </template>
              </el-input>
            </div>
          </template> -->
        <!-- </el-table-column> -->
      </el-table>
      <el-table
        v-if="activeTab === 'rew1870'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        :row-style="{ background: '#0f2142' }"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />

        <el-table-column label="钢卷号">
          <el-table-column prop="calCoilId" label="入口" width="130" />
          <el-table-column prop="rclCoilId" label="出口" width="130" />
        </el-table-column>

        <el-table-column label="重卷成材率">
          <el-table-column prop="rclYield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.rclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalRclYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalRclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="enCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="porCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="porCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口实际">
          <el-table-column prop="exCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="exCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="exCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="exCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="exCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="exCuttailWt" label="切尾重量[kg]" width="120" />

          <el-table-column prop="exSampleNum" label="取样刀数" width="100" />
          <el-table-column prop="exSampleLen" label="取样长度[m]" width="100" />
          <el-table-column prop="exSampleWt" label="取样重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口理论">
          <el-table-column prop="trCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="trCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="sumcoilNum" label="分卷个数" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
          <el-table-column prop="ypClass" label="钢种分档" width="100" />
          <el-table-column prop="wtDiff" label="重量偏差" width="100" />
        </el-table-column>

          <el-table-column prop="rclYieldRemark" label="成材率异常原因" width="240" />
          <!-- <el-table-column prop="yieldRemark" label="异常原因描述" width="180" /> -->

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="steelGrade" label="钢种牌号" width="100" />
        <el-table-column prop="preLine" label="上游机组" width="100" />
        <el-table-column prop="porNo" label="开卷机号" width="80" />
        <el-table-column prop="trNo" label="卷取机号" width="80" />

        <el-table-column label="全流程成材率(酸轧)">
          <el-table-column prop="hotCoilId" label="入口卷号" width="130" />
          <el-table-column prop="coldCoilId" label="出口卷号" width="130" />
          <el-table-column prop="tcmEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="tcmYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.tcmYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="tcmReason" label="异常原因描述" width="240" />
        </el-table-column>

        <el-table-column label="全流程成材率(连退)">
          <el-table-column prop="calEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="calExWt" label="出口重量[kg]" width="120" />
          <el-table-column prop="calYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.calYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="calReason" label="异常原因描述" width="240" />
          <el-table-column prop="wholeYield" label="全工序成材率" width="200" >
            <template #default="{ row }"> {{ (row.wholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalSumWeight" label="重卷出口重量[kg]" width="200" />
        </el-table-column>

        <el-table-column label="标记(1为异常)">
          <el-table-column prop="trimWtFlag" label="切边" width="80" />
          <el-table-column prop="isflag" label="废卷" width="100" />
        </el-table-column>

        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" /> -->
        <!-- <el-table-column v-for="col in yieldRcl2280Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center"> -->
          <!-- <template #default="scope">
            <div v-if="col.prop == 'abnormalReason'">
              <el-input
                :value="scope.row[col.prop] || ''"
                @keyup.enter="handleReasonEnter(scope.row, scope.row[col.prop])"
                v-model="scope.row[col.prop]"
                @focus="handleReasonFocus(scope.row[col.prop])"
              >
                <template #append>
                  <div class="table-cell-btn">
                    <el-button type="primary" @click="handleReasonEnter(scope.row, scope.row[col.prop])" size="small">保存</el-button>
                  </div>
                </template>
              </el-input>
            </div>
          </template> -->
        <!-- </el-table-column> -->
      </el-table>
      <el-table
        v-if="activeTab === 'rew1630'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        :row-style="{ background: '#0f2142' }"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />

        <el-table-column label="钢卷号">
          <el-table-column prop="calCoilId" label="入口" width="130" />
          <el-table-column prop="rclCoilId" label="出口" width="130" />
        </el-table-column>

        <el-table-column label="重卷成材率">
          <el-table-column prop="rclYield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.rclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalRclYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalRclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="enCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="porCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="porCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口实际">
          <el-table-column prop="exCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="exCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="exCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="exCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="exCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="exCuttailWt" label="切尾重量[kg]" width="120" />

          <el-table-column prop="exSampleNum" label="取样刀数" width="100" />
          <el-table-column prop="exSampleLen" label="取样长度[m]" width="100" />
          <el-table-column prop="exSampleWt" label="取样重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口理论">
          <el-table-column prop="trCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="trCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="sumcoilNum" label="分卷个数" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
          <el-table-column prop="ypClass" label="钢种分档" width="100" />
          <el-table-column prop="wtDiff" label="重量偏差" width="100" />
        </el-table-column>

          <el-table-column prop="rclYieldRemark" label="成材率异常原因" width="240" />
          <!-- <el-table-column prop="yieldRemark" label="异常原因描述" width="180" /> -->

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="steelGrade" label="钢种牌号" width="100" />
        <el-table-column prop="preLine" label="上游机组" width="100" />
        <el-table-column prop="porNo" label="开卷机号" width="80" />
        <el-table-column prop="trNo" label="卷取机号" width="80" />

        <el-table-column label="全流程成材率(酸轧)">
          <el-table-column prop="hotCoilId" label="入口卷号" width="130" />
          <el-table-column prop="coldCoilId" label="出口卷号" width="130" />
          <el-table-column prop="tcmEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="tcmYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.tcmYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="tcmReason" label="异常原因描述" width="240" />
        </el-table-column>

        <el-table-column label="全流程成材率(连退)">
          <el-table-column prop="calEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="calExWt" label="出口重量[kg]" width="120" />
          <el-table-column prop="calYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.calYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="calReason" label="异常原因描述" width="240" />
          <el-table-column prop="wholeYield" label="全工序成材率" width="200" >
            <template #default="{ row }"> {{ (row.wholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalSumWeight" label="重卷出口重量[kg]" width="200" />
        </el-table-column>

        <el-table-column label="标记(1为异常)">
          <el-table-column prop="trimWtFlag" label="切边" width="80" />
          <el-table-column prop="isflag" label="废卷" width="100" />
        </el-table-column>
        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" />
        <el-table-column v-for="col in yieldRcl2280Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center"> -->
          <!-- <template #default="scope">
            <div v-if="col.prop == 'abnormalReason'">
              <el-input
                :value="scope.row[col.prop] || ''"
                @keyup.enter="handleReasonEnter(scope.row, scope.row[col.prop])"
                v-model="scope.row[col.prop]"
                @focus="handleReasonFocus(scope.row[col.prop])"
              >
                <template #append>
                  <div class="table-cell-btn">
                    <el-button type="primary" @click="handleReasonEnter(scope.row, scope.row[col.prop])" size="small">保存</el-button>
                  </div>
                </template>
              </el-input>
            </div>
          </template> -->
        <!-- </el-table-column> -->
      </el-table>
      <el-table
        v-if="activeTab === 'rew2150'"
        :data="pagedTableData"
        style="width: 100%; min-width: 1200px; max-width: 100vw"
        :max-height="tableMaxHeight"
        border
        highlight-current-row
        size="small"
        :cell-class-name="tableCellClassName"
        :header-cell-style="{ background: '#2a5caa', color: '#fff', padding: '4px 8px', textAlign: 'center', fontWeight: 'normal', border: 'none' }"
        :cell-style="{ padding: '4px 8px', textAlign: 'center', color: '#c0c4cc', border: 'none' }"
        :scrollbar-always-on="true"
        @selection-change="handleSelectionChange"
        :row-class-name="rowClassName"
        :row-style="{ background: '#0f2142' }"
      >
        <el-table-column type="selection" :selectable="selectable" width="55" />
        <el-table-column label="钢卷号">
          <el-table-column prop="calCoilId" label="入口" width="130" />
          <el-table-column prop="rclCoilId" label="出口" width="130" />
        </el-table-column>

        <el-table-column label="重卷成材率">
          <el-table-column prop="rclYield" label="单卷[%]" width="80">
            <template #default="{ row }"> {{ (row.rclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalRclYield" label="总卷[%]" width="80" >
            <template #default="{ row }"> {{ (row.totalRclYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="yieldTheory" label="理论[%]" width="80" >
            <template #default="{ row }"> {{ (row.yieldTheory * 100).toFixed(2) }} </template>
          </el-table-column>
        </el-table-column>

        <el-table-column label="班组/次">
          <el-table-column prop="crew" label="组" width="60" />
          <el-table-column prop="shift" label="次" width="60" />
        </el-table-column>

        <el-table-column label="入口实际">
          <el-table-column prop="enCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="enCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="enCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="enCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="enCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="enCuttailWt" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口理论">
          <el-table-column prop="porCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="porCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="porCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="porCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口实际">
          <el-table-column prop="exCutheadNum" label="切头刀数" width="100" />
          <el-table-column prop="exCutheadLen" label="切头长度[m]" width="100" />
          <el-table-column prop="exCutheadWt" label="切头重量[kg]" width="120" />

          <el-table-column prop="exCuttailNum" label="切尾刀数" width="100" />
          <el-table-column prop="exCuttailLen" label="切尾长度[m]" width="100" />
          <el-table-column prop="exCuttailWt" label="切尾重量[kg]" width="120" />

          <el-table-column prop="exSampleNum" label="取样刀数" width="100" />
          <el-table-column prop="exSampleLen" label="取样长度[m]" width="100" />
          <el-table-column prop="exSampleWt" label="取样重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="出口理论">
          <el-table-column prop="trCutHeadLenTheory" label="切头长度[m]" width="100" />
          <el-table-column prop="trCutHeadWtTheory" label="切头重量[kg]" width="120" />
          <el-table-column prop="trCutTailLenTheory" label="切尾长度[m]" width="100" />
          <el-table-column prop="trCutTailWtTheory" label="切尾重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="切边">
          <el-table-column prop="trimWidth" label="切后宽度[mm]" width="120" />
          <el-table-column prop="trimWt" label="切边重量[kg]" width="120" />
          <el-table-column prop="trimWtTheory" label="理论重量[kg]" width="120" />
        </el-table-column>

        <el-table-column label="入口">
          <el-table-column prop="enLen" label="长度[m]" width="100" />
          <el-table-column prop="enThk" label="厚度[mm]" width="100" />
          <el-table-column prop="enWid" label="宽度[mm]" width="100" />
          <el-table-column prop="enWt" label="重量[kg]" width="100" />
        </el-table-column>

        <el-table-column label="出口">
          <el-table-column prop="exLen" label="长度[m]" width="100" />
          <el-table-column prop="exThk" label="厚度[mm]" width="100" />
          <el-table-column prop="exWid" label="宽度[mm]" width="100" />
          <el-table-column prop="exWt" label="重量[kg]" width="100" />
          <el-table-column prop="sumcoilNum" label="分卷个数" width="100" />
          <el-table-column prop="exthkClass" label="厚度分档" width="100" />
          <el-table-column prop="exwidthClass" label="宽度分档" width="100" />
          <el-table-column prop="ypClass" label="钢种分档" width="100" />
          <el-table-column prop="wtDiff" label="重量偏差" width="100" />
        </el-table-column>

          <el-table-column prop="rclYieldRemark" label="成材率异常原因" width="240" />
          <!-- <el-table-column prop="yieldRemark" label="异常原因描述" width="180" /> -->

        <el-table-column label="生产时间">
          <el-table-column prop="prodStartTime" label="开始" width="180" />
          <el-table-column prop="prodEndTime" label="结束" width="180" />
          <el-table-column prop="createTime" label="创建" width="200" />
        </el-table-column>

        <el-table-column prop="steelGrade" label="钢种牌号" width="100" />
        <el-table-column prop="preLine" label="上游机组" width="100" />
        <el-table-column prop="porNo" label="开卷机号" width="80" />
        <el-table-column prop="trNo" label="卷取机号" width="80" />

        <el-table-column label="全流程成材率(酸轧)">
          <el-table-column prop="hotCoilId" label="入口卷号" width="130" />
          <el-table-column prop="coldCoilId" label="出口卷号" width="130" />
          <el-table-column prop="tcmEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="tcmYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.tcmYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="tcmReason" label="异常原因描述" width="240" />
        </el-table-column>

        <el-table-column label="全流程成材率(连退)">
          <el-table-column prop="calEnWt" label="入口重量[kg]" width="120" />
          <el-table-column prop="calExWt" label="出口重量[kg]" width="120" />
          <el-table-column prop="calYield" label="成材率" width="80" >
            <template #default="{ row }"> {{ (row.calYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="calReason" label="异常原因描述" width="240" />
          <el-table-column prop="wholeYield" label="全工序成材率" width="200" >
            <template #default="{ row }"> {{ (row.wholeYield * 100).toFixed(2) }} </template>
          </el-table-column>
          <el-table-column prop="totalSumWeight" label="重卷出口重量[kg]" width="200" />
        </el-table-column>

        <el-table-column label="标记(1为异常)">
          <el-table-column prop="trimWtFlag" label="切边" width="80" />
          <el-table-column prop="isflag" label="废卷" width="100" />
        </el-table-column>
        <!-- <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" fixed="left" />
        <el-table-column v-for="col in yieldRcl2280Columns" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" align="center"> -->
          <!-- <template #default="scope">
            <div v-if="col.prop == 'abnormalReason'">
              <el-input
                :value="scope.row[col.prop] || ''"
                @keyup.enter="handleReasonEnter(scope.row, scope.row[col.prop])"
                v-model="scope.row[col.prop]"
                @focus="handleReasonFocus(scope.row[col.prop])"
              >
                <template #append>
                  <div class="table-cell-btn">
                    <el-button type="primary" @click="handleReasonEnter(scope.row, scope.row[col.prop])" size="small">保存</el-button>
                  </div>
                </template>
              </el-input>
            </div>
          </template> -->
        <!-- </el-table-column> -->
      </el-table>
    </div>

    <!-- 分页区域 -->
    <div class="pagination-panel">
      <el-pagination
        v-model:current-page="pagination.currentPage"
        v-model:page-size="pagination.pageSize"
        :page-sizes="[200]"
        layout="total, prev, pager, next, jumper"
        :total="pagination.total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        background
        small
      />
    </div>
  </div>

  <el-dialog v-model="showReasondialog" title="异常原因编辑" :before-close="handleClose" ref="dialogRef" @closed="cancel">
    <el-form label-width="auto">
      <el-form-item label="成材率异常原因">
        <el-select
          v-model="curReason"
          placeholder="请选择异常原因"
          style="width: auto; min-width: 160px"
          clearable
          multiple
          collapse-tags
          collapse-tags-tooltip
          :max-collapse-tags="3"
        >
          <el-option v-for="item in reasonOptions" :key="item.value" :label="item.label" :value="item.value" />
          <template #footer>
            <el-button v-if="!isAdding" text bg size="small" @click="onAddOption"> 增加异常原因 </el-button>
            <template v-else>
              <el-input v-model="optionName" class="option-input" placeholder="input option name" size="small" />
              <el-button type="primary" size="small" @click="onConfirm"> 提交 </el-button>
              <el-button size="small" @click="clear">取消</el-button>
            </template>
          </template>
        </el-select>
        <!-- <el-input v-model="curReason" :placeholder="reasonPlaceholder" /> -->
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="dialogReasonSubmit"> 提交 </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
  import { ref, reactive, computed, onMounted } from 'vue';
  import { TableColumnCtx, ElMessageBox, ElMessage } from 'element-plus';
  import { ActualPerformanceRollDeviationApi } from '/@/api/deviationanalysis/ActualPerformanceRollDeviation';
  import { useRoute } from 'vue-router';
  import type { TableInstance } from 'element-plus';
  import dayjs from 'dayjs';
  // --- Interfaces ---
  interface SearchParams {
    timeType: string; // 'start' or 'end'
    dateRange: Date[];
    annealingEntryRollNo: string;
    annealingExitRollNo: string;
    rewindingUnit: string;
    porCutFlag: string;
    yieldRemark: string;
    steelGrade: string;
    crew: string;
    exthkClass: string;
    exwidthClass: string;
  }

  interface TableRow {
    id: number;
    annealingEntryRollNo: string;
    annealingExitRollNo: string;
    steelGrade: string;
    incomingWeight: number;
    finishedWeight: number;
    thickness: number;
    width: number;
    finishedLength: number;
    entryHeadCutWeight: number;
    entryTailCutWeight: number;
    exitHeadCutWeight: number;
    exitTailCutWeight: number;
    halfRollSampleWeight: number;
    annealingYieldRate: string; // Percentage as string
    newScrapRate: string; // Percentage as string
    levelingCutLossJudgement: number;
    annealingCompletionTime: string;
    hallEntryRollNo: string;
    hallExitRollNo1?: string;
    hallExitWeight1?: number;
    hallExitRollNo2?: string;
    hallExitWeight2?: number;
    hallExitRollNo3?: string;
    hallExitWeight3?: number;
    hallExitRollNo4?: string;
    hallExitWeight4?: number;
  }

  interface YieldTcmDetail {
    dbegin?: string;
    dend?: string;
    cglCoilId?: string;
    coldCoilId?: string;
    createTime?: string;
    crew?: string;
    enCutheadLen?: number;
    enCutheadNum?: number;
    enCutheadWt?: number;
    enCuttailLen?: number;
    enCuttailNum?: number;
    enCuttailWt?: number;
    enLen?: number;
    enThk?: number;
    enWid?: number;
    enWt?: number;
    exCutheadLen?: number;
    exCutheadNum?: number;
    exCutheadWt?: number;
    exCuttailLen?: number;
    exCuttailNum?: number;
    exCuttailWt?: number;
    exLen?: number;
    exSampleLen?: number;
    exSampleNum?: number;
    exSampleWt?: number;
    exThk?: number;
    exWid?: number;
    exWt?: number;
    lenZnCoatWtAct?: number;
    lenZnCoatWtPlan?: number;
    noznYieldTheory?: number;
    planno?: string;
    planzncoatwt?: number;
    porCutHeadLenTheory?: number;
    porCutHeadWtTheory?: number;
    porCutTailLenTheory?: number;
    porCutTailWtTheory?: number;
    porNo?: string;
    prodEndTime?: string;
    prodStartTime?: string;
    shift?: string;
    sonLenZnWt?: number;
    steelGrade?: string;
    sumcoilNum?: number;
    surfacemode?: string;
    totalLenZnWt?: number;
    totalNoznWeight?: number;
    totalSumWeight?: number;
    totalYield?: number;
    totalZnYield?: number;
    trCutHeadLenTheory?: number;
    trCutHeadWtTheory?: number;
    trCutTailLenTheory?: number;
    trCutTailWtTheory?: number;
    trNo?: string;
    wtDiff?: number;
    yield?: number;
    yieldRemark?: string;
    zncoatthk?: number;
    znYieldTheory?: number;
    wholeTotalExwtSum?: number;
    tcmCalRclWholeYield?: number;
    rclAbnormalRamark?: string;
  }

  interface YieldCal1630Detail {
    calCoilId?: string;
    calExWidthGuageAvg?: number;
    calExWidthGuageMax?: number;
    calExWidthGuageMin?: number;
    calNeck?: number;
    calWidthGuageCpc4Avg?: number;
    calWidthGuageCpc4Max?: number;
    calWidthGuageCpc4Min?: number;
    coldCoilId?: string;
    createTime?: string;
    crew?: string;
    custcode?: string;
    customname?: string;
    enCutheadLen?: number;
    enCutheadNum?: number;
    enCutheadWt?: number;
    enCuttailLen?: number;
    enCuttailNum?: number;
    enCuttailWt?: number;
    enLen?: number;
    enThk?: number;
    enWid?: number;
    enWt?: number;
    exthkClass?: string;
    exwidthClass?: string;
    exCutheadLen?: number;
    exCutheadNum?: number;
    exCutheadWt?: number;
    exCuttailLen?: number;
    exCuttailNum?: number;
    exCuttailWt?: number;
    exLen?: number;
    exSampleLen?: number;
    exSampleNum?: number;
    exSampleWt?: number;
    exThk?: number;
    exWid?: number;
    exWt?: number;
    hotCoilId?: string;
    nextUnit?: string;
    planno?: string;
    porCutHeadLenTheory?: number;
    porCutHeadWtTheory?: number;
    porCutTailLenTheory?: number;
    porCutTailWtTheory?: number;
    porNo?: string;
    prodEndTime?: string;
    prodStartTime?: string;
    rclCoil1?: string;
    rclCoil2?: string;
    rclCoil3?: string;
    rclCoil4?: string;
    rclCoil5?: string;
    rclExWt1?: number;
    rclExWt2?: number;
    rclExWt3?: number;
    rclExWt4?: number;
    rclExWt5?: number;
    rclTotalExWt?: number;
    rclWholeYield?: number;
    shift?: string;
    steelGrade?: string;
    sumcoilNum?: string;
    surfacemode?: string;
    tcmEnWt?: number;
    tcmReason?: string;
    tcmYield?: number;
    totalSumWeight?: number;
    totalYield?: string;
    trimFlag?: string;
    trimWidth?: number;
    trimWt?: number;
    trimWtTheory?: number;
    trCutHeadLenTheory?: number;
    trCutHeadWtTheory?: number;
    trCutTailLenTheory?: number;
    trCutTailWtTheory?: number;
    trNo?: string;
    wholeYield?: number;
    wtDiff?: number;
    yield?: number;
    yieldRemark?: string;
    yieldTheory?: number;
    ypClass?: string;
    wholeTotalExwtSum?: number;
    tcmCalRclWholeYield?: number;
    rclAbnormalRamark?: string;
  }

  interface YieldCal2150Detail {
    calCoilId?: string;
    calExWidthGuageAvg?: number;
    calExWidthGuageMax?: number;
    calExWidthGuageMin?: number;
    calNeck?: number;
    calWidthGuageCpc4Avg?: number;
    calWidthGuageCpc4Max?: number;
    calWidthGuageCpc4Min?: number;
    coldCoilId?: string;
    createTime?: string;
    crew?: string;
    custcode?: string;
    customname?: string;
    enCutheadLen?: number;
    enCutheadNum?: number;
    enCutheadWt?: number;
    enCuttailLen?: number;
    enCuttailNum?: number;
    enCuttailWt?: number;
    enLen?: number;
    enThk?: number;
    enWid?: number;
    enWt?: number;
    exthkClass?: string;
    exwidthClass?: string;
    exCutheadLen?: number;
    exCutheadNum?: number;
    exCutheadWt?: number;
    exCuttailLen?: number;
    exCuttailNum?: number;
    exCuttailWt?: number;
    exLen?: number;
    exSampleLen?: number;
    exSampleNum?: number;
    exSampleWt?: number;
    exThk?: number;
    exWid?: number;
    exWt?: number;
    hotCoilId?: string;
    nextUnit?: string;
    planno?: string;
    porCutHeadLenTheory?: number;
    porCutHeadWtTheory?: number;
    porCutTailLenTheory?: number;
    porCutTailWtTheory?: number;
    porNo?: string;
    prodEndTime?: string;
    prodStartTime?: string;
    rclCoil1?: string;
    rclCoil2?: string;
    rclCoil3?: string;
    rclCoil4?: string;
    rclCoil5?: string;
    rclExWt1?: number;
    rclExWt2?: number;
    rclExWt3?: number;
    rclExWt4?: number;
    rclExWt5?: number;
    rclTotalExWt?: number;
    rclWholeYield?: number;
    shift?: string;
    steelGrade?: string;
    sumcoilNum?: string;
    surfacemode?: string;
    tcmEnWt?: number;
    tcmReason?: string;
    tcmYield?: number;
    totalSumWeight?: number;
    totalYield?: string;
    trimFlag?: string;
    trimWidth?: number;
    trimWt?: number;
    trimWtTheory?: number;
    trCutHeadLenTheory?: number;
    trCutHeadWtTheory?: number;
    trCutTailLenTheory?: number;
    trCutTailWtTheory?: number;
    trNo?: string;
    wholeYield?: number;
    wtDiff?: number;
    yield?: number;
    yieldRemark?: string;
    yieldTheory?: number;
    ypClass?: string;
    wholeTotalExwtSum?: number;
    tcmCalRclWholeYield?: number;
    rclAbnormalRamark?: string;
  }

  // --- Reactive State ---
  const searchParams = reactive<SearchParams>({
    timeType: 'start',
    dateRange: [],
    annealingEntryRollNo: '',
    annealingExitRollNo: '',
    rewindingUnit: '',
    porCutFlag: '1',
    yieldRemark: '',
    steelGrade: '',
    crew: '',
    exthkClass: '',
    exwidthClass: '',
  });

  // 新增tab切换
  const activeTab = ref<'cgl1870' | 'cal1630' | 'cal2150' | 'tcm2280' | 'rew1870' | 'rew1630' | 'rew2150'>('cgl1870');

  // 新增连退1870的数据源
  const yieldTcmDetails = ref<YieldTcmDetail[]>([]);

  // 新增连退1630的数据源
  const yieldCal1630Details = ref<YieldCal1630Detail[]>([]);

  // 新增连退2150的数据源
  const yieldCal2150Details = ref<YieldCal2150Detail[]>([]);

  // 酸轧2280数据源
  const yieldTcm2280Details = ref<any[]>([]);

  // 重卷1870数据源
  const yieldRcl1870Details = ref<any[]>([]);

  // 重卷1630数据源
  const yieldRcl1630Details = ref<any[]>([]);

  // 重卷2150数据源
  const yieldRcl2150Details = ref<any[]>([]);

  // 镀锌1870的表格列定义
  const yieldTcmColumns = [
    { prop: 'yield', label: '成材率', width: '100' },
    { prop: 'totalYield', label: '总成材率(去掉锌耗)', width: '150' },
    { prop: 'totalZnYield', label: '总成材率(含锌耗)', width: '150' },
    // { prop: 'yieldTheory', label: '理论成材率', width: '150' },
    // { prop: 'tcmCalRclWholeYield', label: '酸轧-连退-重卷全流程成材率', width: '180' },
    { prop: 'znYieldTheory', label: '含锌理论成材率', width: '150' },
    { prop: 'noznYieldTheory', label: '不含锌理论成材率', width: '150' },
    { prop: 'cglCoilId', label: '出口钢卷', width: '140' },
    { prop: 'coldCoilId', label: '入口钢卷', width: '140' },
    { prop: 'abnormalReason', label: '成材率异常原因', width: '240' },
    { prop: 'createTime', label: '创建时间', width: '160' },
    { prop: 'shift', label: '班次', width: '100' },
    { prop: 'crew', label: '班组', width: '100' },
    { prop: 'trimWidth', label: '切边后宽度', width: 180 },
    { prop: 'trimWt', label: '切边重量', width: 180 },
    { prop: 'trimWtTheory', label: '切边理论重量', width: 180 },
    { prop: 'enCutheadLen', label: '入口切头长度', width: '120' },
    { prop: 'porCutHeadLenTheory', label: '入口切头理论长度', width: '150' },
    { prop: 'enCutheadWt', label: '入口切头重量', width: '120' },
    { prop: 'porCutHeadWtTheory', label: '入口切头理论重量', width: '150' },
    { prop: 'enCuttailLen', label: '入口切尾长度', width: '120' },
    { prop: 'porCutTailLenTheory', label: '入口切尾理论长度', width: '150' },
    { prop: 'enCuttailWt', label: '入口切尾重量', width: '120' },
    { prop: 'porCutTailWtTheory', label: '入口切尾理论重量', width: '150' },
    { prop: 'enLen', label: '入口长度', width: '100' },
    { prop: 'enThk', label: '入口厚度', width: '100' },
    { prop: 'enWid', label: '入口宽度', width: '100' },
    { prop: 'enWt', label: '入口钢卷重量', width: '120' },
    { prop: 'exCutheadLen', label: '出口切头长度', width: '120' },
    { prop: 'trCutHeadLenTheory', label: '出口切头理论长度', width: '150' },
    { prop: 'exCutheadNum', label: '出口切头刀数', width: '120' },
    { prop: 'exCutheadWt', label: '出口切头重量', width: '120' },
    { prop: 'trCutHeadWtTheory', label: '出口切头理论重量', width: '150' },
    { prop: 'exCuttailLen', label: '出口切尾长度', width: '120' },
    { prop: 'trCutTailLenTheory', label: '出口切尾理论长度', width: '150' },
    { prop: 'exCuttailNum', label: '出口切尾刀数', width: '120' },
    { prop: 'exCuttailWt', label: '出口切尾重量', width: '120' },
    { prop: 'trCutTailWtTheory', label: '出口切尾理论重量', width: '150' },
    { prop: 'exLen', label: '出口长度', width: '100' },
    { prop: 'exSampleLen', label: '出口取样长度', width: '120' },
    { prop: 'exSampleNum', label: '出口取样刀数', width: '120' },
    { prop: 'exSampleWt', label: '出口取样重量', width: '120' },
    { prop: 'exThk', label: '出口厚度', width: '100' },
    { prop: 'exWid', label: '出口宽度', width: '100' },
    { prop: 'exWt', label: '出口钢卷重量', width: '120' },
    { prop: 'lenZnCoatWtAct', label: '全长锌的重量(实际)', width: '150' },
    { prop: 'lenZnCoatWtPlan', label: '全长锌的重量(计划)', width: '150' },
    { prop: 'planno', label: '计划号', width: '120' },
    { prop: 'planzncoatwt', label: '表面锌层重量(计划)', width: '150' },
    { prop: 'porNo', label: '开卷机号', width: '100' },
    { prop: 'prodEndTime', label: '生产结束时间', width: '160' },
    { prop: 'prodStartTime', label: '生产开始时间', width: '160' },
    { prop: 'sonLenZnWt', label: '子卷上下表面全长锌层重量', width: '180' },
    { prop: 'steelGrade', label: '原料钢种牌号', width: '120' },
    { prop: 'sumcoilNum', label: '所有子卷个数', width: '120' },
    { prop: 'surfacemode', label: '表面处理方式', width: '120' },
    { prop: 'totalLenZnWt', label: '所有子卷上下表面全长锌层重量', width: '180' },
    { prop: 'totalNoznWeight', label: '所有子卷重量和(不含锌层)', width: '180' },
    { prop: 'totalSumWeight', label: '所有子卷重量和(含锌层)', width: '180' },
    { prop: 'zncoatthk', label: '表面锌层厚度', width: '120' },
    { prop: 'wholeTotalExwtSum', label: '酸轧-连退-重卷出口卷重之和', width: '180' },
    { prop: 'rclAbnormalRamark', label: '重卷异常卷说明', width: '150' },
    { prop: 'yp_class', label: '钢种分档', width: '150' },
    { prop: 'trCuttailFlag', label: '出口切尾，0表示正常，1表示异常', width: '150' },
    { prop: 'trCutheadFlag', label: '出口切头，0表示正常，1表示异常', width: '150' },
    { prop: 'trimWtFlag', label: '切边是否正常，0表示正常，1表示异常', width: '150' },
    { prop: 'trimFlag', label: '切边标记', width: '150' },
    { prop: 'tcmYield', label: '酸轧工序成材率', width: '150' },
    { prop: 'tcmReason', label: '酸轧成材率原因', width: '150' },
    { prop: 'tcmEnWt', label: '酸轧入口重量', width: '150' },
    { prop: 'rclTotalExWt', label: '重卷出口子卷重量和', width: '150' },
    { prop: 'rclExWt1', label: '重卷出口子卷重量1', width: '150' },
    { prop: 'rclExWt5', label: '重卷出口子卷重量5', width: '150' },
    { prop: 'rclExWt4', label: '重卷出口子卷重量4', width: '150' },
    { prop: 'rclExWt3', label: '重卷出口子卷重量3', width: '150' },
    { prop: 'rclExWt2', label: '重卷出口子卷重量2', width: '150' },
    { prop: 'rclCoil1', label: '重卷卷号1', width: '150' },
    { prop: 'rclCoil5', label: '重卷卷号5', width: '150' },
    { prop: 'rclCoil4', label: '重卷卷号4', width: '150' },
    { prop: 'rclCoil3', label: '重卷卷号3', width: '150' },
    { prop: 'rclCoil2', label: '重卷卷号2', width: '150' },
    { prop: 'porCuttailFlag', label: '入口切尾，0表示正常，1表示异常', width: '150' },
    { prop: 'porCutheadFlag', label: '入口切头，0表示正常，1表示异常', width: '150' },
    { prop: 'nextUnit', label: '下道工序', width: '150' },
    { prop: 'hotCoilId', label: '热轧卷号', width: '150' },
    { prop: 'exwidthClass', label: '宽度分档', width: '150' },
    { prop: 'exthkClass', label: '出口厚度分档', width: '150' },
    { prop: 'dummyCoilFlag', label: '过渡卷标记', width: '150' },
    { prop: 'customname', label: '客户名称', width: '150' },
    { prop: 'custcode', label: '客户代码', width: '150' },
    { prop: 'cglNeck', label: '镀锌缩颈量', width: '150' },
    { prop: 'cglExGaugeWidthMin', label: '镀锌出口测宽仪宽度最小值', width: '150' },
    { prop: 'cglExGaugeWidthMax', label: '镀锌出口测宽仪宽度最大值', width: '150' },
    { prop: 'cglExGaugeWidthAvg', label: '镀锌出口测宽仪宽度均值', width: '150' },
    { prop: 'cglCpc3WidthMin', label: '镀锌入口测宽仪宽度最小值', width: '150' },
    { prop: 'cglCpc3WidthMax', label: '镀锌入口测宽仪宽度最大值', width: '150' },
    { prop: 'cglCpc3WidthAvg', label: '镀锌入口测宽仪宽度均值', width: '150' },
  ];

  

  // 连退1630的表格列定义
  const yieldCal1630Columns = [
    { prop: 'yield', label: '成材率', width: 180 },
    { prop: 'totalYield', label: '总成材率', width: 180 },
    { prop: 'yieldTheory', label: '理论成材率', width: 180 },
    { prop: 'wholeYield', label: '酸轧到连退全工序成材率', width: 180 },
    { prop: 'calCoilId', label: '出口钢卷', width: 200 },
    { prop: 'abnormalReason', label: '成材率异常原因', width: '240' },
    { prop: 'trimWidth', label: '切边后宽度', width: 180 },
    { prop: 'trimWt', label: '切边重量', width: 180 },
    { prop: 'trimWtTheory', label: '切边理论重量', width: 180 },
    { prop: 'calExWidthGuageAvg', label: '出口测宽仪宽度均值', width: 180 },
    { prop: 'calExWidthGuageMax', label: '出口测宽仪宽度最大值', width: 180 },
    { prop: 'calExWidthGuageMin', label: '出口测宽仪宽度最小值', width: 180 },
    { prop: 'calNeck', label: '连退缩颈量', width: 180 },
    { prop: 'calWidthGuageCpc4Avg', label: '入口测宽仪宽度均值', width: 180 },
    { prop: 'calWidthGuageCpc4Max', label: '入口测宽仪宽度最大值', width: 180 },
    { prop: 'calWidthGuageCpc4Min', label: '入口测宽仪宽度最小值', width: 180 },
    { prop: 'coldCoilId', label: '入口钢卷', width: 200 },
    { prop: 'createTime', label: '创建时间', width: 180 },
    { prop: 'shift', label: '班次', width: 120 },
    { prop: 'crew', label: '班组', width: 120 },
    { prop: 'rclWholeYield', label: '酸轧到重卷全工序成材率', width: 180 },
    { prop: 'custcode', label: '客户代码', width: 180 },
    { prop: 'customname', label: '客户名称', width: 180 },
    { prop: 'enCutheadLen', label: '入口切头长度', width: 180 },
    { prop: 'enCutheadWt', label: '入口切头重量', width: 180 },
    { prop: 'enCuttailLen', label: '入口切尾长度', width: 180 },
    { prop: 'enCuttailWt', label: '入口切尾重量', width: 180 },
    { prop: 'enLen', label: '入口长度', width: 180 },
    { prop: 'enThk', label: '入口厚度', width: 180 },
    { prop: 'enWid', label: '入口宽度', width: 180 },
    { prop: 'enWt', label: '入口钢卷重量', width: 180 },
    { prop: 'exthkClass', label: '出口厚度分档', width: 180 },
    { prop: 'exwidthClass', label: '宽度分档', width: 180 },
    { prop: 'exCutheadLen', label: '出口切头长度', width: 180 },
    { prop: 'exCutheadNum', label: '出口切头刀数', width: 180 },
    { prop: 'exCutheadWt', label: '出口切头重量', width: 180 },
    { prop: 'exCuttailLen', label: '出口切尾长度', width: 180 },
    { prop: 'exCuttailNum', label: '出口切尾刀数', width: 180 },
    { prop: 'exCuttailWt', label: '出口切尾重量', width: 180 },
    { prop: 'exLen', label: '出口长度', width: 180 },
    { prop: 'exSampleLen', label: '出口取样长度', width: 180 },
    { prop: 'exSampleNum', label: '出口取样刀数', width: 180 },
    { prop: 'exSampleWt', label: '出口取样重量', width: 180 },
    { prop: 'exThk', label: '出口厚度', width: 180 },
    { prop: 'exWid', label: '出口宽度', width: 180 },
    { prop: 'exWt', label: '出口钢卷重量', width: 180 },
    { prop: 'hotCoilId', label: '热轧卷号', width: 180 },
    { prop: 'nextUnit', label: '下道工序', width: 180 },
    { prop: 'planno', label: '计划号', width: 180 },
    { prop: 'porCutHeadLenTheory', label: '入口切头理论长度', width: 180 },
    { prop: 'porCutHeadWtTheory', label: '入口切头理论重量', width: 180 },
    { prop: 'porCutTailLenTheory', label: '入口切尾理论长度', width: 180 },
    { prop: 'porCutTailWtTheory', label: '入口切尾理论重量', width: 180 },
    { prop: 'porNo', label: '开卷机号', width: 180 },
    { prop: 'prodEndTime', label: '生产结束时间', width: 180 },
    { prop: 'prodStartTime', label: '生产开始时间', width: 180 },
    { prop: 'rclCoil1', label: '重卷卷号1', width: 180 },
    { prop: 'rclCoil2', label: '重卷卷号2', width: 180 },
    { prop: 'rclCoil3', label: '重卷卷号3', width: 180 },
    { prop: 'rclCoil4', label: '重卷卷号4', width: 180 },
    { prop: 'rclCoil5', label: '重卷卷号5', width: 180 },
    { prop: 'rclExWt1', label: '重卷出口子卷重量1', width: 180 },
    { prop: 'rclExWt2', label: '重卷出口子卷重量2', width: 180 },
    { prop: 'rclExWt3', label: '重卷出口子卷重量3', width: 180 },
    { prop: 'rclExWt4', label: '重卷出口子卷重量4', width: 180 },
    { prop: 'rclExWt5', label: '重卷出口子卷重量5', width: 180 },
    { prop: 'rclTotalExWt', label: '重卷出口子卷重量和', width: 180 },
    { prop: 'steelGrade', label: '原料钢种牌号', width: 180 },
    { prop: 'sumcoilNum', label: '所有子卷个数', width: 180 },
    { prop: 'surfacemode', label: '表面处理方式', width: 180 },
    { prop: 'tcmEnWt', label: '酸轧入口重量', width: 180 },
    { prop: 'tcmReason', label: '酸轧成材率原因', width: 180 },
    { prop: 'tcmYield', label: '酸轧工序成材率', width: 180 },
    { prop: 'totalSumWeight', label: '所有子卷重量和', width: 180 },
    { prop: 'trimFlag', label: '切边标记', width: 180 },
    { prop: 'trCutHeadLenTheory', label: '出口切头理论长度', width: 180 },
    { prop: 'trCutHeadWtTheory', label: '出口切头理论重量', width: 180 },
    { prop: 'trCutTailLenTheory', label: '出口切尾理论长度', width: 180 },
    { prop: 'trCutTailWtTheory', label: '出口切尾理论重量', width: 180 },
    { prop: 'yieldRemark', label: '异常原因描述', width: 180 },
    { prop: 'ypClass', label: '钢种分档', width: 180 },
    { prop: 'wholeTotalExwtSum', label: '酸轧-连退-重卷出口卷重之和', width: 180 },
    { prop: 'rclAbnormalRamark', label: '重卷异常卷说明', width: 180 },
  ];

  // 连退2150的表格列定义
  const yieldCal2150Columns = [
    { prop: 'yield', label: '成材率', width: 180 },
    { prop: 'totalYield', label: '总成材率', width: 180 },
    { prop: 'yieldTheory', label: '理论成材率', width: 180 },
    { prop: 'wholeYield', label: '酸轧到连退全工序成材率', width: 180 },
    { prop: 'calCoilId', label: '出口钢卷', width: 200 },
    { prop: 'abnormalReason', label: '成材率异常原因', width: '240' },
    { prop: 'trimWidth', label: '切边后宽度', width: 180 },
    { prop: 'trimWt', label: '切边重量', width: 180 },
    { prop: 'trimWtTheory', label: '切边理论重量', width: 180 },
    { prop: 'calExWidthGuageAvg', label: '出口测宽仪宽度均值', width: 180 },
    { prop: 'calExWidthGuageMax', label: '出口测宽仪宽度最大值', width: 180 },
    { prop: 'calExWidthGuageMin', label: '出口测宽仪宽度最小值', width: 180 },
    { prop: 'calNeck', label: '连退缩颈量', width: 180 },
    { prop: 'calWidthGuageCpc4Avg', label: '入口测宽仪宽度均值', width: 180 },
    { prop: 'calWidthGuageCpc4Max', label: '入口测宽仪宽度最大值', width: 180 },
    { prop: 'calWidthGuageCpc4Min', label: '入口测宽仪宽度最小值', width: 180 },
    { prop: 'coldCoilId', label: '入口钢卷', width: 200 },
    { prop: 'createTime', label: '创建时间', width: 180 },
    { prop: 'shift', label: '班次', width: 120 },
    { prop: 'crew', label: '班组', width: 120 },
    { prop: 'custcode', label: '客户代码', width: 180 },
    { prop: 'customname', label: '客户名称', width: 180 },
    { prop: 'enCutheadLen', label: '入口切头长度', width: 180 },
    { prop: 'enCutheadWt', label: '入口切头重量', width: 180 },
    { prop: 'enCuttailLen', label: '入口切尾长度', width: 180 },
    { prop: 'enCuttailWt', label: '入口切尾重量', width: 180 },
    { prop: 'enLen', label: '入口长度', width: 180 },
    { prop: 'enThk', label: '入口厚度', width: 180 },
    { prop: 'enWid', label: '入口宽度', width: 180 },
    { prop: 'enWt', label: '入口钢卷重量', width: 180 },
    { prop: 'exthkClass', label: '出口厚度分档', width: 180 },
    { prop: 'exwidthClass', label: '宽度分档', width: 180 },
    { prop: 'exCutheadLen', label: '出口切头长度', width: 180 },
    { prop: 'exCutheadNum', label: '出口切头刀数', width: 180 },
    { prop: 'exCutheadWt', label: '出口切头重量', width: 180 },
    { prop: 'exCuttailLen', label: '出口切尾长度', width: 180 },
    { prop: 'exCuttailNum', label: '出口切尾刀数', width: 180 },
    { prop: 'exCuttailWt', label: '出口切尾重量', width: 180 },
    { prop: 'exLen', label: '出口长度', width: 180 },
    { prop: 'exSampleLen', label: '出口取样长度', width: 180 },
    { prop: 'exSampleNum', label: '出口取样刀数', width: 180 },
    { prop: 'exSampleWt', label: '出口取样重量', width: 180 },
    { prop: 'exThk', label: '出口厚度', width: 180 },
    { prop: 'exWid', label: '出口宽度', width: 180 },
    { prop: 'exWt', label: '出口钢卷重量', width: 180 },
    { prop: 'hotCoilId', label: '热轧卷号', width: 180 },
    { prop: 'nextUnit', label: '下道工序', width: 180 },
    { prop: 'planno', label: '计划号', width: 180 },
    { prop: 'porCutHeadLenTheory', label: '入口切头理论长度', width: 180 },
    { prop: 'porCutHeadWtTheory', label: '入口切头理论重量', width: 180 },
    { prop: 'porCutTailLenTheory', label: '入口切尾理论长度', width: 180 },
    { prop: 'porCutTailWtTheory', label: '入口切尾理论重量', width: 180 },
    { prop: 'porNo', label: '开卷机号', width: 180 },
    { prop: 'prodEndTime', label: '生产结束时间', width: 180 },
    { prop: 'prodStartTime', label: '生产开始时间', width: 180 },
    { prop: 'rclCoil1', label: '重卷卷号1', width: 180 },
    { prop: 'rclCoil2', label: '重卷卷号2', width: 180 },
    { prop: 'rclCoil3', label: '重卷卷号3', width: 180 },
    { prop: 'rclCoil4', label: '重卷卷号4', width: 180 },
    { prop: 'rclCoil5', label: '重卷卷号5', width: 180 },
    { prop: 'rclExWt1', label: '重卷出口子卷重量1', width: 180 },
    { prop: 'rclExWt2', label: '重卷出口子卷重量2', width: 180 },
    { prop: 'rclExWt3', label: '重卷出口子卷重量3', width: 180 },
    { prop: 'rclExWt4', label: '重卷出口子卷重量4', width: 180 },
    { prop: 'rclExWt5', label: '重卷出口子卷重量5', width: 180 },
    { prop: 'rclTotalExWt', label: '重卷出口子卷重量和', width: 180 },
    { prop: 'rclWholeYield', label: '酸轧到重卷全工序成材率', width: 180 },
    { prop: 'steelGrade', label: '原料钢种牌号', width: 180 },
    { prop: 'sumcoilNum', label: '所有子卷个数', width: 180 },
    { prop: 'surfacemode', label: '表面处理方式', width: 180 },
    { prop: 'tcmEnWt', label: '酸轧入口重量', width: 180 },
    { prop: 'tcmReason', label: '酸轧成材率原因', width: 180 },
    { prop: 'tcmYield', label: '酸轧工序成材率', width: 180 },
    { prop: 'totalSumWeight', label: '所有子卷重量和', width: 180 },
    { prop: 'trimFlag', label: '切边标记', width: 180 },
    { prop: 'trCutHeadLenTheory', label: '出口切头理论长度', width: 180 },
    { prop: 'trCutHeadWtTheory', label: '出口切头理论重量', width: 180 },
    { prop: 'trCutTailLenTheory', label: '出口切尾理论长度', width: 180 },
    { prop: 'trCutTailWtTheory', label: '出口切尾理论重量', width: 180 },
    { prop: 'yieldRemark', label: '异常原因描述', width: 180 },
    { prop: 'ypClass', label: '钢种分档', width: 180 },
    { prop: 'wholeTotalExwtSum', label: '酸轧-连退-重卷出口卷重之和', width: 180 },
    { prop: 'rclAbnormalRamark', label: '重卷异常卷说明', width: 180 },
  ];

  // 酸轧2280表格列定义
  const yieldTcm2280Columns = [
    { prop: 'yield', label: '成材率', width: 100 },
    { prop: 'totalYield', label: '总成材率', width: 120 },
    { prop: 'yieldTheory', label: '理论最大成材率', width: 150 },
    { prop: 'coldCoilId', label: '出口钢卷', width: 140 },
    { prop: 'hotCoilId', label: '入口钢卷', width: 140 },
    { prop: 'planno', label: '计划号', width: 120 },
    { prop: 'abnormalReason', label: '成材率异常原因', width: '240' },
    { prop: 'createTime', label: '创建时间', width: 160 },
    { prop: 'shift', label: '班次', width: 100 },
    { prop: 'crew', label: '班组', width: 100 },
    { prop: 'trimWtTheory', label: '理论最小切边重量', width: 120 },
    { prop: 'wtWaste', label: '切头尾加切边重量和', width: 150 },
    { prop: 'enCutheadLen', label: '入口切头长度', width: 120 },
    { prop: 'enCutheadWt', label: '入口切头重量', width: 120 },
    { prop: 'enCutheadWtTheory', label: '入口切头理论重量', width: 120 },
    { prop: 'enCuttailLen', label: '入口切尾长度', width: 120 },
    { prop: 'enCuttailWt', label: '入口切尾重量', width: 120 },
    { prop: 'enCuttailWtTheory', label: '入口切尾理论重量', width: 120 },
    { prop: 'enLen', label: '入口长度', width: 100 },
    { prop: 'enThk', label: '入口厚度', width: 100 },
    { prop: 'enWid', label: '入口宽度', width: 100 },
    { prop: 'enWt', label: '入口钢卷重量', width: 120 },
    { prop: 'exthkClass', label: '出口厚度分档', width: 120 },
    { prop: 'exwidthClass', label: '宽度分档', width: 120 },
    { prop: 'exLen', label: '出口长度', width: 100 },
    { prop: 'exThk', label: '出口厚度', width: 100 },
    { prop: 'exWid', label: '出口宽度', width: 100 },
    { prop: 'exWt', label: '出口钢卷重量', width: 120 },
    { prop: 'feoWtTheory', label: '理论酸洗氧化铁皮重量', width: 150 },
    { prop: 'porCutheadFlag', label: '入口切头异常', width: 120 },
    { prop: 'porCuttailFlag', label: '入口切尾异常', width: 120 },
    { prop: 'porNo', label: '开卷机号', width: 100 },
    { prop: 'prodEndTime', label: '生产结束时间', width: 160 },
    { prop: 'prodStartTime', label: '生产开始时间', width: 160 },
    { prop: 'steelGrade', label: '钢种牌号', width: 120 },
    { prop: 'subNum', label: '分卷个数', width: 120 },
    { prop: 'totalSumWeight', label: '子卷总重量', width: 120 },
    { prop: 'trimFlag', label: '切边标记', width: 120 },
    { prop: 'trimWidth', label: '切边后宽度', width: 120 },
    { prop: 'trimWt', label: '切边重量估算', width: 120 },
    { prop: 'trimWtFlag', label: '切边是否正常', width: 120 },
    { prop: 'yieldRemark', label: '异常原因描述', width: 150 },
    { prop: 'ypClass', label: '钢种分档', width: 120 },
  ];

  const yieldRcl2280Columns = [
    { prop: 'rclCoilId', label: '出口卷号', width: 140 },
    { prop: 'calCoilId', label: '入口卷号', width: 120 },
    { prop: 'coldCoilId', label: '酸轧出口卷号', width: 150 },
    { prop: 'hotCoilId', label: '酸轧入口卷号', width: 140 },
    { prop: 'preLine', label: '上游机组', width: 140 },
    { prop: 'steelGrade', label: '原料钢种牌号', width: 120 },
    { prop: 'prodStartTime', label: '生产开始时间', width: 160 },
    { prop: 'prodEndTime', label: '生产结束时间', width: 160 },
    { prop: 'shift', label: '班次', width: 100 },
    { prop: 'crew', label: '班组', width: 100 },
    { prop: 'rclYield', label: '重卷子卷成材率', width: 120 },
    { prop: 'totalRclYield', label: '重卷总成材率', width: 150 },
    { prop: 'exWt', label: '出口单个子卷重量', width: 160 },
    { prop: 'enWt', label: '入口钢卷重量', width: 120 },
    { prop: 'enThk', label: '入口厚度', width: 120 },
    { prop: 'exThk', label: '出口厚度', width: 120 },
    { prop: 'enWid', label: '入口宽度', width: 120 },
    { prop: 'exWid', label: '出口宽度', width: 120 },
    { prop: 'enLen', label: '入口长度', width: 100 },
    { prop: 'exLen', label: '出口长度', width: 100 },
    { prop: 'trimFlag', label: '切边标记', width: 100 },
    { prop: 'trimWidth', label: '切边后宽度', width: 100 },
    { prop: 'trimWt', label: '切边重量', width: 120 },
    { prop: 'sumcoilNum', label: '分卷个数', width: 150 },
    { prop: 'totalSumWeight', label: '重卷所有子卷重量和', width: 160 },
    { prop: 'enCutheadNum', label: '入口切头刀数', width: 120 },
    { prop: 'enCutheadLen', label: '入口切头长度', width: 120 },
    { prop: 'enCutheadWt', label: '入口切头重量', width: 120 },
    { prop: 'enCuttailNum', label: '入口切尾刀数', width: 120 },
    { prop: 'enCuttailLen', label: '入口切尾长度', width: 120 },
    { prop: 'enCuttailWt', label: '入口切尾重量', width: 120 },
    { prop: 'exCutheadNum', label: '出口切头刀数', width: 120 },
    { prop: 'exCutheadLen', label: '出口切头长度', width: 120 },
    { prop: 'exCutheadWt', label: '出口切头重量', width: 120 },
    { prop: 'exCuttailNum', label: '出口切尾刀数', width: 120 },
    { prop: 'exCuttailLen', label: '出口切尾长度', width: 120 },
    { prop: 'exCuttailWt', label: '出口切尾重量', width: 120 },
    { prop: 'exSampleNum', label: '出口取样刀数', width: 120 },
    { prop: 'exSampleLen', label: '出口取样长度', width: 120 },
    { prop: 'exSampleWt', label: '出口取样重量', width: 120 },
    { prop: 'porNo', label: '开卷机号', width: 120 },
    { prop: 'trNo', label: '卷取机号', width: 120 },
    { prop: 'wtDiff', label: '重量偏差', width: 120 },
    { prop: 'porCutHeadLenTheory', label: '入口切头理论长度', width: 140 },
    { prop: 'porCutHeadWtTheory', label: '入口切头理论重量', width: 140 },
    { prop: 'porCutTailLenTheory', label: '入口切尾理论长度', width: 140 },
    { prop: 'porCutTailWtTheory', label: '入口切尾理论重量', width: 140 },
    { prop: 'trCutHeadLenTheory', label: '出口切头理论长度', width: 140 },
    { prop: 'trCutHeadWtTheory', label: '出口切头理论重量', width: 140 },
    { prop: 'trCutTailLenTheory', label: '出口切尾理论长度', width: 140 },
    { prop: 'trCutTailWtTheory', label: '出口切尾理论重量', width: 140 },
    { prop: 'trimWtTheory', label: '切边理论重量', width: 120 },
    { prop: 'yieldTheory', label: '理论成材率', width: 120 },
    { prop: 'rclYieldRemark', label: '成材率异常原因描述', width: 140 },
    { prop: 'tcmEnWt', label: '酸轧入口重量', width: 120 },
    { prop: 'tcmYield', label: '酸轧成材率', width: 120 },
    { prop: 'tcmReason', label: '酸轧成材率低，异常原因描述', width: 180 },
    { prop: 'calEnWt', label: '连退入口重量', width: 120 },
    { prop: 'calExWt', label: '连退出口各子卷总重量和', width: 180 },
    { prop: 'calYield', label: '连退成材率', width: 120 },
    { prop: 'calReason', label: '连退成材率低，异常原因描述', width: 200 },
    { prop: 'wholeYield', label: '酸轧-连退-重卷全工序成材率', width: 200 },
    { prop: 'exthkClass', label: '厚度分档', width: 120 },
    { prop: 'exwidthClass', label: '宽度分档', width: 120 },
    { prop: 'ypClass', label: '钢种分档', width: 120 },
    { prop: 'createTime', label: '创建时间', width: 160 },
    { prop: 'isflag', label: '是否正常卷(3000kg废卷)', width: 180 },
  ];

  // const curInput = ref('');
  const tableLoading = ref(false);
  const selection = ref<any[]>([]);
  const cgl1870TableRef = ref<TableInstance>();
  const cal1630TableRef = ref<TableInstance>();
  const cal2150TableRef = ref<TableInstance>();
  const tcm2280TableRef = ref<TableInstance>();
  const curReason = ref<any>([]);
  const reasonOptions = ref([
    { label: '横折印', value: '横折印' },
    { label: 'O5多切', value: 'O5多切' },
    { label: '夹杂多切', value: '夹杂多切' },
    { label: '张力偏差多切', value: '张力偏差多切' },
    { label: '边裂多切', value: '边裂多切' },
    { label: '版型不良', value: '版型不良' },
    { label: '厚度不均', value: '厚度不均' },
    { label: '孔洞', value: '孔洞' },
  ]);
  const optionName = ref('');
  const isAdding = ref(false);
  const onAddOption = () => {
    isAdding.value = true;
  };
  const onConfirm = () => {
    if (optionName.value) {
      reasonOptions.value.push({
        label: optionName.value,
        value: optionName.value,
      });
      clear();
    }
  };
  const clear = () => {
    optionName.value = '';
    isAdding.value = false;
  };
  const showReasondialog = ref(false);
  const reasonEdit = () => {
    showReasondialog.value = true;
  };
  // 详情弹窗关闭事件
  const handleClose = (done: () => void) => {
    ElMessageBox.confirm('确定要关闭当前窗口吗?')
      .then(() => {
        cancel();
      })
      .catch(() => {
        // catch error
      });
  };

  // 详情弹窗取消事件
  const cancel = () => {
    curReason.value = [];
    showReasondialog.value = false;
  };

  const rowClassName = ({ row }: { row: any }) => {
    if (row.porCutheadFlag == '1' || row.porCuttailFlag == '1') {
      return 'warning-row';
    }
    return '';
  };

  const selectable = (row: any) => {
    if (row.porCutheadFlag == '1' || row.porCuttailFlag == '1') {
      return true;
    }
    return false;
  };

  // 异常原因编辑提交事件
  const dialogReasonSubmit = async () => {
    try {
      if (activeTab.value === 'cgl1870') {
        const params: any = {
          abnormalReason: curReason.value.join(','),
          coilds: selection.value.map((row) => row.cglCoilId),
        };
        await ActualPerformanceRollDeviationApi.updateAbnormalReasonCgl1870(params).then(() => {
          fetchYieldTcmDetails();
          showReasondialog.value = false;
        });
      } else if (activeTab.value === 'cal2150') {
        const params: any = {
          abnormalReason: curReason.value.join(','),
          coilds: selection.value.map((row) => row.calCoilId),
        };
        await ActualPerformanceRollDeviationApi.updateAbnormalReasonCal2150(params).then(() => {
          fetchYieldCal2150Details();
          showReasondialog.value = false;
        });
      } else if (activeTab.value === 'cal1630') {
        const params: any = {
          abnormalReason: curReason.value.join(','),
          coilds: selection.value.map((row) => row.calCoilId),
        };
        await ActualPerformanceRollDeviationApi.updateAbnormalReasonCal1630(params).then(() => {
          fetchYieldCal1630Details();
          showReasondialog.value = false;
        });
      } else if (activeTab.value === 'tcm2280') {
        const params: any = {
          abnormalReason: curReason.value.join(','),
          coldCoilIds: selection.value.map((row) => row.coldCoilId),
        };
        await ActualPerformanceRollDeviationApi.updateAbnormalReasonTcm2280(params).then(() => {
          fetchYieldTcm2280Details();
          showReasondialog.value = false;
        });
      }
    } catch (e) {
      console.error('异常原因编辑失败：' + e);
      ElMessage.error('保存失败');
    }
  };
  const handleSelectionChange = (val: TableRow[]) => {
    selection.value = val;
  };

  // --- Mock Table Data (Total 33776 rows based on image) ---
  const allTableData = ref<TableRow[]>(
    Array.from({ length: 33776 }, (_, i) => {
      const baseId = 234000080 + i;
      const entryNo = `C${baseId}`;
      const exitNo = `A${String(baseId + Math.floor(Math.random() * 100)).padStart(9, '0')}`;
      const yieldRate = (90 + Math.random() * 10).toFixed(2);
      const cutLoss = Math.random() > 0.8 ? Math.floor(Math.random() * 20) + 1 : 0; // Some have cut loss

      const hallData: Partial<TableRow> = {};
      if (i % 5 === 1) {
        hallData.hallExitRollNo1 = `E${String(baseId + 1000).padStart(9, '0')}`;
        hallData.hallExitWeight1 = Math.floor(Math.random() * 5000) + 3000;
      }
      if (i % 7 === 2) {
        hallData.hallExitRollNo1 = `E${String(baseId + 1100).padStart(9, '0')}`;
        hallData.hallExitWeight1 = Math.floor(Math.random() * 5000) + 3000;
        hallData.hallExitRollNo2 = `E${String(baseId + 1200).padStart(9, '0')}`;
        hallData.hallExitWeight2 = Math.floor(Math.random() * 4000) + 2000;
      }
      if (i % 11 === 3) {
        hallData.hallExitRollNo1 = `E${String(baseId + 1300).padStart(9, '0')}`;
        hallData.hallExitWeight1 = Math.floor(Math.random() * 5000) + 3000;
        hallData.hallExitRollNo2 = `E${String(baseId + 1400).padStart(9, '0')}`;
        hallData.hallExitWeight2 = Math.floor(Math.random() * 4000) + 2000;
        hallData.hallExitRollNo3 = `E${String(baseId + 1500).padStart(9, '0')}`;
        hallData.hallExitWeight3 = Math.floor(Math.random() * 3000) + 1000;
      }
      if (i % 13 === 4) {
        hallData.hallExitRollNo1 = `E${String(baseId + 1600).padStart(9, '0')}`;
        hallData.hallExitWeight1 = Math.floor(Math.random() * 5000) + 3000;
        hallData.hallExitRollNo2 = `E${String(baseId + 1700).padStart(9, '0')}`;
        hallData.hallExitWeight2 = Math.floor(Math.random() * 4000) + 2000;
        hallData.hallExitRollNo3 = `E${String(baseId + 1800).padStart(9, '0')}`;
        hallData.hallExitWeight3 = Math.floor(Math.random() * 3000) + 1000;
        hallData.hallExitRollNo4 = `E${String(baseId + 1900).padStart(9, '0')}`;
        hallData.hallExitWeight4 = Math.floor(Math.random() * 2000) + 500;
      }

      return {
        id: i + 1,
        annealingEntryRollNo: entryNo,
        annealingExitRollNo: exitNo,
        steelGrade: i % 3 === 0 ? 'DC06' : i % 5 === 1 ? 'DC05' : 'DC01',
        incomingWeight: parseFloat((28 + Math.random() * 5).toFixed(3)),
        finishedWeight: parseFloat((25 + Math.random() * 4).toFixed(3)),
        thickness: i % 4 === 0 ? 0.884 : 0.88,
        width: i % 6 === 0 ? 1495 : 1485,
        finishedLength: 8500 + Math.floor(Math.random() * 2000),
        entryHeadCutWeight: 0,
        entryTailCutWeight: 0,
        exitHeadCutWeight: 0,
        exitTailCutWeight: 0,
        halfRollSampleWeight: 0,
        annealingYieldRate: `${yieldRate}%`,
        newScrapRate: `${(100 - parseFloat(yieldRate)).toFixed(2)}%`,
        levelingCutLossJudgement: cutLoss,
        annealingCompletionTime: `2023-04-02 22:${String(10 + (i % 50)).padStart(2, '0')}:${String(10 + (i % 60)).padStart(2, '0')}`,
        hallEntryRollNo: `E${String(baseId + 500).padStart(9, '0')}`,
        ...hallData,
      };
    })
  );

  // --- Pagination ---
  const pagination = reactive({
    currentPage: 1,
    pageSize: 20, // Default to 30 based on image
    total: allTableData.value.length,
  });

  const pagedTableData = computed(() => {
    if (activeTab.value === 'cgl1870') {
      return yieldTcmDetails.value;
    } else if (activeTab.value === 'cal1630') {
      return yieldCal1630Details.value;
    } else if (activeTab.value === 'cal2150') {
      return yieldCal2150Details.value;
    } else if (activeTab.value === 'tcm2280') {
      return yieldTcm2280Details.value;
    } else if (activeTab.value === 'rew1870') {
      return yieldRcl1870Details.value;
    } else if (activeTab.value === 'rew1630') {
      return yieldRcl1630Details.value;
    } else if (activeTab.value === 'rew2150') {
      return yieldRcl2150Details.value;
    }
    return allTableData.value;
  });

  const indexMethod = (index: number) => {
    return (pagination.currentPage - 1) * pagination.pageSize + index + 1;
  };

  const handleSizeChange = (val: number) => {
    pagination.pageSize = val;
    pagination.currentPage = 1; // Reset to first page
    if (activeTab.value === 'cgl1870') {
      fetchYieldTcmDetails();
    } else if (activeTab.value === 'cal1630') {
      fetchYieldCal1630Details();
    } else if (activeTab.value === 'cal2150') {
      fetchYieldCal2150Details();
    } else if (activeTab.value === 'tcm2280') {
      fetchYieldTcm2280Details();
    }
  };

  const handleCurrentChange = (val: number) => {
    pagination.currentPage = val;
    if (activeTab.value === 'cgl1870') {
      fetchYieldTcmDetails();
    } else if (activeTab.value === 'cal1630') {
      fetchYieldCal1630Details();
    } else if (activeTab.value === 'cal2150') {
      fetchYieldCal2150Details();
    } else if (activeTab.value === 'tcm2280') {
      fetchYieldTcm2280Details();
    } else if (activeTab.value === 'rew1870') {
      fetchYieldRcl1870Details();
    } else if (activeTab.value === 'rew1630') {
      fetchYieldRcl1630Details();
    } else if (activeTab.value === 'rew2150') {
      fetchYieldRcl2150Details();
    }
  };

  // --- Table Cell Styling ---
  interface CellClassNameParams {
    row: TableRow;
    column: TableColumnCtx<TableRow>;
    rowIndex: number;
    columnIndex: number;
  }
  const tableCellClassName = ({ row, column, rowIndex, columnIndex }: CellClassNameParams) => {
    //console.log(row, column, rowIndex, columnIndex);
    if (column.property === 'levelingCutLossJudgement' && row.levelingCutLossJudgement > 0) {
      return 'red-text';
    }
    return '';
  };

  // --- Handlers ---
  const handleSearch = async () => {
    //console.log('查询参数:', searchParams);
    pagination.currentPage = 1;
    if (activeTab.value === 'cgl1870') {
      await fetchYieldTcmDetails();
    } else if (activeTab.value === 'cal1630') {
      await fetchYieldCal1630Details();
    } else if (activeTab.value === 'cal2150') {
      await fetchYieldCal2150Details();
    } else if (activeTab.value === 'tcm2280') {
      await fetchYieldTcm2280Details();
    } else if (activeTab.value === 'rew1870') {
      await fetchYieldRcl1870Details();
    } else if (activeTab.value === 'rew1630') {
      await fetchYieldRcl1630Details();
    } else if (activeTab.value === 'rew2150') {
      await fetchYieldRcl2150Details();
    }
  };

  const handleReset = () => {
    Object.keys(searchParams).forEach((key) => {
      const typedKey = key as keyof SearchParams;
      if (typedKey === 'dateRange') searchParams[typedKey] = [];
      else if (typedKey === 'timeType') searchParams[typedKey] = 'start';
      else searchParams[typedKey] = '';
    });
    pagination.currentPage = 1;
    // Reset filtering here
    console.log('重置参数');
  };

  const handleExport = async () => {
    let params: any = {
      page: {
        pageIndex: pagination.currentPage,
        pageSize: pagination.pageSize,
      },
      dto: {},
    };
    if (searchParams.annealingEntryRollNo) params.dto.coldCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.dto.hotCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.dto.porCutFlag = searchParams.porCutFlag;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dto.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dto.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    try {
      if (activeTab.value === 'cgl1870') {
        await ActualPerformanceRollDeviationApi.export1870(params);
      } else if (activeTab.value === 'cal1630') {
        await ActualPerformanceRollDeviationApi.export1630(params);
      } else if (activeTab.value === 'cal2150') {
        await ActualPerformanceRollDeviationApi.export2150(params);
      } else if (activeTab.value === 'tcm2280') {
        await ActualPerformanceRollDeviationApi.export2280(params);
      }
    } catch (e) {
      console.error(`获取${activeTab.value}数据失败:`, e);
      ElMessage.error(`导出${activeTab.value}数据失败`);
    }
  };

  const handleTabChange = (tab: string) => {
    console.log('切换到:', tab);
    selection.value = [];
    pagination.currentPage = 1;
    if (tab === 'cgl1870') {
      fetchYieldTcmDetails();
    } else if (tab === 'cal1630') {
      fetchYieldCal1630Details();
    } else if (tab === 'cal2150') {
      fetchYieldCal2150Details();
    } else if (tab === 'tcm2280') {
      fetchYieldTcm2280Details();
    } else if (tab === 'rew1870') {
      fetchYieldRcl1870Details();
    } else if (tab === 'rew1630') {
      fetchYieldRcl1630Details();
    } else if (tab === 'rew2150') {
      fetchYieldRcl2150Details();
    }
  };

  // 新增格式化时间函数
  function formatDateTime(date: Date, isStart: boolean = true) {
    const y = date.getFullYear();
    const m = String(date.getMonth() + 1).padStart(2, '0');
    const d = String(date.getDate()).padStart(2, '0');
    return `${y}-${m}-${d} ${isStart ? '00:00:01' : '23:59:59'}`;
  }

  // 获取连退1870数据的方法
  const fetchYieldTcmDetails = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.coldCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.cglCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldtcm_detais(params);
      yieldTcmDetails.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取连退1870数据失败:', e);
      yieldTcmDetails.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  // 获取连退1630数据的方法
  const fetchYieldCal1630Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.coldCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.calCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldcal1630_detais(params);
      yieldCal1630Details.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取连退1630数据失败:', e);
      yieldCal1630Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  // 获取连退2150数据的方法
  const fetchYieldCal2150Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.coldCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.calCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldcal2150_detais(params);
      yieldCal2150Details.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取连退2150数据失败:', e);
      yieldCal2150Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  // 获取酸轧2280数据的方法
  const fetchYieldTcm2280Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.coldCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.hotCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    console.log('tcm2280' + params);
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldtcm2280_detais(params);
      yieldTcm2280Details.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取酸轧2280数据失败:', e);
      yieldTcm2280Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  // 获取重卷1870数据的方法
  const fetchYieldRcl1870Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.calCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.rclCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    params.dbegin = formatDateTime(new Date('2025-09-03 00:00:01'), true);
    params.dend = formatDateTime(new Date('2025-09-16 23:59:59'), false);
    console.log('rcl1870' + params);
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldrcl1870_detais(params);
      const list = Array.isArray(res?.data?.data) ? res.data.data : [];
      yieldRcl1870Details.value = list.map((it: any) => ({
        ...it,
        createTime: formatToYMDHMS(it?.createTime),
      }));
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取重卷1870数据失败:', e);
      yieldRcl1870Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  const fetchYieldRcl1630Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.calCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.rclCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    console.log('rcl1630' + params);
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldrcl1630_detais(params);
      yieldRcl1630Details.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取重卷1870数据失败:', e);
      yieldRcl1630Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  const fetchYieldRcl2150Details = async () => {
    tableLoading.value = true;
    let params: any = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
    };
    if (searchParams.annealingEntryRollNo) params.calCoilId = searchParams.annealingEntryRollNo;
    if (searchParams.annealingExitRollNo) params.rclCoilId = searchParams.annealingExitRollNo;
    if (searchParams.porCutFlag) params.porCutFlag = searchParams.porCutFlag;
    if (searchParams.yieldRemark) params.yieldRemark = searchParams.yieldRemark;
    if (searchParams.steelGrade) params.steelGrade = searchParams.steelGrade;
    if (searchParams.crew) params.crew = searchParams.crew;
    if (searchParams.exthkClass) params.exthkClass = searchParams.exthkClass;
    if (searchParams.exwidthClass) params.exwidthClass = searchParams.exwidthClass;
    if (searchParams.dateRange && searchParams.dateRange.length === 2) {
      params.dbegin = formatDateTime(new Date(searchParams.dateRange[0]), true);
      params.dend = formatDateTime(new Date(searchParams.dateRange[1]), false);
    }
    console.log('rcl2150' + params);
    try {
      const res = await ActualPerformanceRollDeviationApi.get_tbyieldrcl2150_detais(params);
      yieldRcl2150Details.value = Array.isArray(res?.data?.data) ? res.data.data : [];
      pagination.total = res?.data?.count || 0;
    } catch (e) {
      console.error('获取重卷1870数据失败:', e);
      yieldRcl2150Details.value = [];
      pagination.total = 0;
    } finally {
      tableLoading.value = false;
    }
  };

  // 初始化加载
  const route = useRoute();
  onMounted(() => {
    // 跳转带参数时自动切换tab和时间范围
    console.log('1111');
    if (route.query.tab) {
      activeTab.value = route.query.tab as any;
    }
    if (route.query.yieldRemark) {
      searchParams.yieldRemark = route.query.yieldRemark.toString();
    }
    if (route.query.steelGrade) {
      searchParams.steelGrade = route.query.steelGrade.toString();
    }

    if (route.query.crew) {
      searchParams.crew = route.query.crew.toString();
    }

    // 添加对厚度分档和宽度分档参数的处理
    if (route.query.exthkClass) {
      // 如果需要在搜索参数中添加厚度分档字段
      searchParams.exthkClass = route.query.exthkClass.toString();
    }
    if (route.query.exwidthClass) {
      // 如果需要在搜索参数中添加宽度分档字段
      searchParams.exwidthClass = route.query.exwidthClass.toString();
    }

    // 初始化时间
    const start = dayjs().format('YYYY-MM-DD');
    const end = dayjs().format('YYYY-MM-DD');
    searchParams.dateRange = [new Date(start), new Date(end)];

    // 修复时间参数处理，添加有效性检查
    if (route.query.start && route.query.end) {
      const startStr = route.query.start as string;
      const endStr = route.query.end as string;

      // 检查字符串是否有效且不为空
      if (startStr && endStr && startStr !== 'undefined' && endStr !== 'undefined') {
        try {
          const startDate = new Date(startStr);
          const endDate = new Date(endStr);

          // 检查日期是否有效
          if (!isNaN(startDate.getTime()) && !isNaN(endDate.getTime())) {
            searchParams.dateRange = [startDate, endDate];
            handleSearch();
          } else {
            console.warn('无效的日期格式:', startStr, endStr);
            // 如果日期无效，仍然执行默认查询
            if (activeTab.value === 'cgl1870') {
              fetchYieldTcmDetails();
            }
          }
        } catch (error) {
          console.error('日期解析错误:', error);
          // 如果解析失败，仍然执行默认查询
          if (activeTab.value === 'cgl1870') {
            fetchYieldTcmDetails();
          }
        }
      } else {
        console.warn('时间参数为空或无效');
        // 如果时间参数无效，仍然执行默认查询
        if (activeTab.value === 'cgl1870') {
          fetchYieldTcmDetails();
        }
      }
    } else {
      if (activeTab.value === 'cgl1870') {
        fetchYieldTcmDetails();
      }
    }

    // onMounted 默认查询分支
    if (activeTab.value === 'rew1870') {
      fetchYieldTcm2280Details();
    }
  });
  function formatToYMDHMS(input: any) {
    if (!input) return '';
    const d = new Date(input);
    if (isNaN(d.getTime())) return '';
    const y = d.getFullYear();
    const m = String(d.getMonth() + 1).padStart(2, '0');
    const day = String(d.getDate()).padStart(2, '0');
    const hh = String(d.getHours()).padStart(2, '0');
    const mm = String(d.getMinutes()).padStart(2, '0');
    const ss = String(d.getSeconds()).padStart(2, '0');
    return `${y}-${m}-${day} ${hh}:${mm}:${ss}`;
  }

  const tableMaxHeight = computed(() => `calc(100vh - 320px)`); // 320px根据实际头部和分页高度调整
</script>

<style scoped>
  /* --- Container and Base Styles (Consistent with MaterialStandards) --- */
  .yield-rate-container {
    background-color: #0a1a3a;
    color: #c0c4cc;
    padding: 15px;
    height: 100%;
    box-sizing: border-box;
    font-family: 'Microsoft YaHei', 'Segoe UI', sans-serif;
    font-size: 13px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  .yield-rate-container > *:not(:last-child) {
    margin-bottom: 10px; /* Reduced margin */
  }

  /* Search Panel (Consistent) */
  .search-panel {
    background-color: #1c2d5a;
    padding: 10px 15px;
    border-radius: 3px;
    flex-shrink: 0;
  }
  .search-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 5px;
  }
  .search-row:last-child {
    margin-bottom: 0;
  }
  .search-item {
    display: flex;
    align-items: center;
    margin-right: 15px; /* Adjusted margin */
    margin-bottom: 5px;
  }
  .label {
    color: #c0c4cc;
    margin-right: 5px;
    white-space: nowrap;
    min-width: 90px; /* Adjusted for longer labels */
    text-align: right;
    font-size: 12px;
  }
  .time-selection .label {
    min-width: 40px;
  }

  :deep(.el-radio-button__inner) {
    background-color: #0a1a3a;
    border-color: #3a5a8a;
    color: #c0c4cc;
    box-shadow: none !important;
    font-size: 12px;
    padding: 5px 10px;
  }
  :deep(.el-radio-button__original-radio:checked + .el-radio-button__inner) {
    background-color: #2979ff;
    border-color: #2979ff;
    color: #fff;
  }

  :deep(.custom-date-picker.el-date-editor) {
    height: 28px;
    background-color: #0a1a3a;
    border: 1px solid #3a5a8a;
    box-shadow: none;
  }
  :deep(.custom-date-picker .el-range-input),
  :deep(.custom-date-picker .el-range-separator) {
    color: #c0c4cc;
    font-size: 12px;
    height: 26px;
    line-height: 26px;
  }
  :deep(.custom-date-picker .el-range-separator) {
    padding: 0 2px;
  }
  :deep(.custom-date-picker .el-input__icon) {
    line-height: 28px;
    color: #c0c4cc;
    font-size: 12px;
  }

  .custom-input,
  :deep(.el-input__wrapper) {
    height: 28px;
    line-height: 28px;
    background-color: #0a1a3a !important;
    border: 1px solid #3a5a8a !important;
    border-radius: 3px !important;
    color: #c0c4cc !important;
    box-shadow: none !important;
    font-size: 12px !important; /* Smaller font */
    width: 160px; /* Adjusted width */
  }
  :deep(.el-input__inner) {
    color: #c0c4cc !important;
    height: 26px !important;
    line-height: 26px !important;
  }

  .search-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    padding-left: 10px;
  }
  .btn {
    height: 28px;
    padding: 0 12px;
    border: none;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
    margin-left: 8px;
    color: #fff;
  }
  .query-btn {
    background-color: #2979ff;
  }
  .query-btn:hover {
    background-color: #5393ff;
  }
  .reset-btn {
    background-color: #3a5a8a;
  }
  .reset-btn:hover {
    background-color: #5a7aa4;
  }
  .export-btn {
    background-color: #2979ff;
  }
  .export-btn:hover {
    background-color: #5393ff;
  }

  /* Table Panel */
  .table-panel {
    height: calc(100vh - 260px); /* 260px根据实际头部和分页高度调整 */
    background-color: #1c2d5a;
    padding: 5px;
    border-radius: 3px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  :deep(.el-table) {
    background-color: transparent !important;
    --el-table-border: none;
    --el-table-row-hover-bg-color: unset;
    color: white;
    min-width: 4000px;
  }

  :deep(.el-table__body-wrapper) {
    overflow-x: auto !important;
    overflow-y: auto !important;
    max-height: 100% !important;
    /* scrollbar-width: thin; */
    scrollbar-color: #42b4ff #0f2142;
  }
  :deep(.el-table__body-wrapper::-webkit-scrollbar) {
    width: 10px;
    height: 12px;
    background: #0f2142;
    border-radius: 6px;
  }
  :deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
    background: linear-gradient(135deg, #42b4ff 40%, #2979ff 100%);
    border-radius: 6px;
    min-height: 30px;
    min-width: 30px;
    box-shadow: 0 0 6px #42b4ff88;
  }
  :deep(.el-table__body-wrapper::-webkit-scrollbar-thumb:hover) {
    background: linear-gradient(135deg, #00eaff 0%, #2979ff 100%);
  }

  :deep(.current-row .el-table__cell) {
    background-color: #0f2142 !important;
  }

  /* Custom Cell Style */
  .red-text {
    color: #ff4d4f !important;
    font-weight: bold;
  }
  :deep(.el-table__cell.red-text) {
    color: #ff4d4f !important;
    font-weight: bold;
  }

  /* Pagination Panel (Consistent) */
  .pagination-panel {
    background-color: #1c2d5a;
    padding: 5px 15px;
    border-radius: 3px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-shrink: 0;
  }
  /* Deep pagination styles (Consistent for small size) */
  :deep(.el-pagination button),
  :deep(.el-pager li) {
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    margin: 0 2px;
    font-size: 12px;
  }
  :deep(.el-pagination__jump .el-input__wrapper) {
    height: 22px;
    line-height: 22px;
    width: 35px;
    font-size: 12px;
  }
  :deep(.el-pagination__jump .el-input__inner) {
    height: 20px !important;
    line-height: 20px !important;
  }
  :deep(.el-pagination__sizes .el-select .el-input__wrapper) {
    height: 22px;
    line-height: 22px;
    font-size: 12px !important;
    width: 80px;
  }
  :deep(.el-pagination__sizes .el-select .el-input__inner) {
    height: 20px !important;
    line-height: 20px !important;
  }

  /* Ensure Hall data display looks reasonable */
  :deep(.el-table .cell) {
    white-space: nowrap; /* Prevent wrapping in cells */
    color: #fff !important;
  }

  /* 表格标签页样式 */
  .table-tabs-bar {
    background: #1c2d5a;
    border-radius: 3px 3px 0 0;
    padding: 0 5px;
    margin-bottom: 5px;
    width: 100%;
  }

  .table-tabs {
    margin-bottom: 0;
  }

  .table-tabs :deep(.el-tabs__header) {
    margin: 0;
    border-bottom: 1px solid #2a5caa;
  }

  .table-tabs :deep(.el-tabs__nav) {
    border: none;
  }

  .table-tabs :deep(.el-tabs__item) {
    color: #a2dfff;
    font-size: 14px;
    font-weight: bold;
    height: 36px;
    line-height: 36px;
    transition: color 0.2s;
  }

  .table-tabs :deep(.el-tabs__item.is-active) {
    color: #fff !important;
    background: none;
  }

  .table-tabs :deep(.el-tabs__active-bar) {
    background-color: #1890ff !important;
    height: 3px;
    border-radius: 2px 2px 0 0;
  }

  .table-tabs :deep(.el-tabs__nav-wrap::after) {
    height: 1px;
    background-color: #2a5caa;
  }

  /* 添加无数据时的背景样式 */
  :deep(.el-table__empty-block) {
    background-color: #0f2142;
  }
  :deep(.el-table__empty-text) {
    color: #c0c4cc;
  }

  :deep(.el-input-group__append) {
    color: #fff;
    background-color: #1890ff;
    border-left-color: #1890ff;
    box-shadow: none;
    font-size: 12px;
    height: 28px;
  }

  :deep(.el-button) {
    height: 28px;
    padding: 0 12px;
    border: none;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
    margin-left: 8px;
    color: #fff;
    background-color: #2979ff;
  }

  .el-table__fixed .warning-row td {
    background-color: #966 !important;
  }

  :deep(.el-table .warning-row td) {
    background-color: #966 !important;
    color: #fff !important;
  }

  :deep(.el-table__body .el-table-fixed-column--left) {
    /* background-color: #966 !important; */
    background-color: #0f2142 !important;
  }

  :deep(.el-table__body .warning-row .el-table-fixed-column--left) {
    background-color: #966 !important;
  }

  .custom-select,
  :deep(.el-select__wrapper) {
    height: 28px;
    line-height: 28px;
    background-color: #0a1a3a !important;
    border: 1px solid #3a5a8a !important;
    border-radius: 3px !important;
    color: #c0c4cc !important;
    box-shadow: none !important;
    font-size: 12px !important; /* Smaller font */
    /* width: 160px;  Adjusted width */
  }
  :deep(.custom-select .el-input__inner) {
    color: #c0c4cc !important;
    height: 26px !important;
    line-height: 26px !important;
  }
  /* :deep(.el-scrollbar .el-scrollbar__bar .el-scrollbar__thumb) {
    background-color: #42b4ff;
  } */
</style>
